JQ Mobile Collapsible - хочу что-то сделать, когда складные расширяются .. наберите, как уволить его

Question

У меня есть несколько страниц с несколькими складками на них. Когда он расширяется, я хочу закрыть все остальные. Я прочитал, что мне нужно использовать .trigger ('expand') и .trigger ('collapse'), чтобы динамически открывать и закрывать ... НО КАК Я запускаю событие, когда сборка действительно открыта?

Я подумал, что MAYBE событие click ... $('#myExpandable').click() - нет. Я пытался связать .bind('expand', function() {}); - no go ... И я попробовал .live('expand', function() {}); .. все безрезультатно.

Может кто-нибудь подскажет мне здесь?

Спасибо!

Answer 1

Вы можете привязать к expand событию элемента, а затем вызвать collapse событие на остальных collaspibles:

//since we don't know when the page will be injected into the DOM, 
//we can bind to it's elements once it's been added to the DOM and is about to be initialized 
$(document).delegate('#my-page-id', 'pageinit', function() { 

    //cache each of the collapsible elements in a variable 
    var $collapse = $(this).find('[data-role="collapsible"]'); 

    //bind to each collapsible's `expand` event 
    $collapse.bind('expand', function() { 

     //when a collapsible is expanded, collapse all the others on this page 
     $collapse.not(this).trigger('collapse'); 

    }); 
});​ 

Вот демо: http://jsfiddle.net/FhZVn/