Jquery mobile 和 Jquery Jplayer 冲突

Question

我遇到了 Jquery Mobile 和 Jquery Jplayer 相互冲突的问题。我面临的问题是，当您将 Jquery Jplayer 包含到 Jquery 移动网站中并单击按钮开始收听音频时，它会更改按钮 html 并更改网站的外观，因为 Jquery 移动不会只需更改html，它会添加以下代码。

<span class="ui-btn-inner ui-btn-corner-all">
<span class="ui-btn-text">Continue</span>
</span>

每次我尝试通过包含以下脚本来覆盖它时：

$(this).html('继续');

它只是不起作用。知道在这种情况下该怎么办吗？

Answer 1

如果您下载了带有主题的 JQM，那么 JQM 将覆盖您的样式和任何插件样式中的基本元素。

有一个仅适用于结构的 JQM css 的下载： http://code.jquery.com/mobile/1.1.0/jquery.mobile.structure-1.1.0.css

这里有几个选项：

1) 如果样式与盒装主题不同，请进入您的 CSS 并执行 JQM 覆盖以实现一致的样式。

2) 创建您自己的 JQM 主题。

3) 询问您是否真的需要使用 JQM 框架。很多时候我从 JQM 开始，只是为了用微型 javascript/jQuery 解决方案替换大部分功能。如果您发现自己剥离了 JQM 功能并用其他东西替换它，那么您应该质疑使用 JQM 是否是最好的方法。

Answer 2

要更新 jQuery Mobile UI 元素，您必须在修改源元素后对项目调用 .refresh()（仅适用于表单元素，不适用于链接按钮）。

$(this).html('Continue').button('refresh');

或者 Change button text jquery mobile

$("#consumed .ui-btn-text").text("标记新");

。

如果你的元素是一个按钮：

$(this).closest(".ui-btn").find(".ui-btn-text").text("Continue");

如果是链接：

$(this).find(".ui-btn-text").text("Continue");