我想使用 jquery mobile 更改按钮上的文本。如果我将数据角色更改为无,它会起作用,但随后我会丢失格式。
<fieldset class="ui-grid-a" data-inline="true">
<div class="ui-block-a"><button class="cl_button1" type="submit"
data-theme="c" data-icon="home" data-iconpos="top">Click Me</button>
</div>
</fieldset>
$('.cl_button1').val('some text');
另一个帖子建议这样做,但没有用。
$("cl_button1 .ui-btn-text").text("some text");
使用 Firebug 我发现 jQuery Mobile 创建的 HTML 标记如下:
<fieldset data-inline="true" class="ui-grid-a">
<div class="ui-block-a">
<div data-theme="c" class="ui-btn ui-btn-icon-top ui-btn-corner-all ui-shadow ui-btn-up-c" aria-disabled="false">
<span class="ui-btn-inner ui-btn-corner-all">
<span class="ui-btn-text">some text</span>
<span class="ui-icon ui-icon-home ui-icon-shadow"></span>
</span>
<input type="hidden" value="">
<input type="hidden" value="">
<input type="hidden" value="">
<button data-iconpos="top" data-icon="home" data-theme="c" type="submit" class="cl_button1 ui-btn-hidden" aria-disabled="false">Click Me</button>
</div>
</div>
</fieldset>
您可以看到ui-btn-hidden
类已添加到原来的<button>
元素和按钮的显示实际上是通过使用<span>
上面的标签<button>
tag.
因此,要更改此 jQuery Mobile 呈现元素的文本,您可以使用如下选择器:
$('.cl_button1').siblings('.ui-btn-inner').children('.ui-btn-text').text("some text");
或者,如果您想在单击时更改按钮的文本,可以执行以下操作:
$('.cl_button1').bind('click', function () {
$(this).siblings('.ui-btn-inner').children('.ui-btn-text').text("some text");
});
这是一个用于演示的jsfiddle:http://jsfiddle.net/SfySk/1/ http://jsfiddle.net/SfySk/1/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)