我想知道是否有一些API可以检测何时在jQuery mobile中打开可折叠项目。
https://api.jquerymobile.com/collapsible/
或者我们必须使用自定义jQuery事件?
我的意思是有一种方法来检测可折叠集的扩展
$( ".selector" ).on( "collapsibleexpand", function( event, ui ) {} );
但没有API方式来检测哪个项目已被展开......
答案 0 :(得分:1)
你可以找到没有折叠的div:
$('#myc').on('collapsibleexpand', function( event, ui ) {
$(this).find('div.ui-collapsible:not(.ui-collapsible-collapsed)')...
});
或附加事件处理程序:
$('a.ui-collapsible-heading-toggle').on('tap click', function(e) {
....
})
摘录:
$(document).on("pagecreate", function () {
$('a.ui-collapsible-heading-toggle').on('tap click', function(e) {
if ($(this).closest('div.ui-collapsible').is('.ui-collapsible-collapsed')) {
console.log('tap click: ' + this.childNodes[0].textContent);
}
})
$('#myc').on('collapsibleexpand', function( event, ui ) {
var ele = $(this).find('div.ui-collapsible:not(.ui-collapsible-collapsed)');
console.log('collapsibleexpand: ' + ele.find('a.ui-collapsible-heading-toggle').get(0).childNodes[0].textContent);
});
});

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<div data-role="content" id="myc">
<div data-role="collapsible">
<h3>I'm a header1</h3>
<p>I'm the collapsible content. By default I'm closed, but you can click the header to open me.</p>
</div>
<div data-role="collapsible">
<h3>I'm a header2</h3>
<p>I'm the collapsible content. By default I'm closed, but you can click the header to open me.</p>
</div>
</div>
&#13;