JQuery-Mobile collapsible expand/collapse event

Question

Does anyone know any other way to capture the event of expanding or collapsing a component marked with data-role="collapsible" apart from the onclick event of its header?

EDIT: I would like some kind of event that will also provide information about the expanded/collapsed state of the component.

Answer 1

There are custom events for the collapsible blocks. You can bind to the expand and collapse events:

$('#my-collapsible').bind('expand', function () {
    alert('Expanded');
}).bind('collapse', function () {
    alert('Collapsed');
});

Here is a jsfiddle: http://jsfiddle.net/6txWy/

Answer 2

In jQuery Mobile 1.4 there are the collapsiblecollapse and collapsibleexpand events. https://api.jquerymobile.com/collapsible/#event-collapse

$( ".selector" ).on( "collapsiblecollapse", function( event, ui ) {} );