我使用新的jquery mobile 1.0 alpha 1版本来构建一个移动应用程序,我需要能够切换按钮的文本。切换文本工作正常,但一旦执行文本替换,css格式化被破坏。
混乱格式的屏幕截图:http://awesomescreenshot.com/03e2r50d2
<div class="ui-bar">
<a data-role="button" href="#" onclick="podcast.play(); return false" id="play">Play</a>
<a data-role="button" href="#" onclick="podcast.download(); return false" id="download">Download</a>
<a data-role="button" href="#" onclick="podcast.consumed(); return false" id="consumed">Mark Old</a>
</div>
$("#consumed").text("Mark New");
解决方法
当您创建按钮时,它会添加一些其他元素,某些内部< span>元素看起来像这样:
<a data-role="button" href="#" onclick="podcast.consumed(); return false" id="consumed">
<span class="ui-btn-inner ui-btn-corner-all">
<span class="ui-btn-text">Mark Old</span>
</span>
</a>
要更改文字,您需要使用此选择器:
$("#consumed .ui-btn-text").text("Mark New");