jquery-mobile - 如何动态更改 JQM 中的数据主题以进行可折叠？

Question

我需要在按钮单击时执行此操作，该操作位于可折叠中，所以我这样做：

my_button.closest('div[data-theme="b"]').find('a.ui-btn-up-b').toggleClass('ui-btn-up-b ui-btn-up-d');

但不幸的是，仍然有一些样式需要更改，但我不知道是哪个...

Answer 1

更新的答案

由于动态解决方案不适用于collapsible，因此这里是手动解决方案。

工作演示

代码

$('#button').on('click', function () {
 var oldclass = 'ui-btn-up-b ui-body-b';
 var newclass = 'ui-btn-up-d ui-body-d';
 $('[data-role=collapsible]').find('a').removeClass(oldclass  + ' ui-btn-hover-b').addClass(newclass + ' ui-btn-hover-d');
 $('[data-role=collapsible]').find('.ui-collapsible-content').removeClass(oldclass).addClass(newclass);
});

---

为什么无法动态更改可折叠数据主题？

---

旧答案

不幸的是，以下动态解决方案令人惊讶地不起作用。

.selectorCollapsible的ID在哪里。

$('button').on('click', function () {

 // change the theme
 $( ".selector" ).collapsible( "option", "theme", "a" );

 // apply new styles
 $( ".selector" ).collapsible().trigger('create');

});