我目前正在使用 JQuery Mobile 开发适用于 Android 的 PhoneGap 应用程序。 我想要的只是动态更改可折叠的标题文本:
<div data-role="collapsible" id="collapse">
<h3>I'm a header</h3>
<p>I'm the collapsible content</p>
</div>
该代码来自 demos.jquerymobile.com。 Chrome DevTools 为这个示例提供了以下 html: http://de.tinypic.com/r/2uf982p/8
出于任何原因,如果我将完全相同的代码复制到我的 index.html 并运行它,chrome DevTools 会给我以下 html: http://de.tinypic.com/r/2wohcf7/8
为什么会有不同的html代码?
我实际上可以通过以下方式更改标题的文本
$("#collapse").text("new text");
但随后它失去了所有的样式,而且
$("#collapse").trigger('create').
什么都不做。我做错了什么?
最佳答案
要保留小部件的所有样式,最简单的方法是 destroy the widget ,更改标题文本,然后重新初始化小部件:
<div data-role="collapsible" id="collapse">
<h3 id="collapse-header">I'm a header</h3>
<p>I'm the collapsible content</p>
</div>
$("#collapse").collapsible( "destroy" );
$('#collapse-header').text('I\'m a new header!');
$("#collapse").collapsible();
关于javascript - JQuery Mobile 创建了错误的 HTML 代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29865755/