javascript-jQuery Mobile:更新导航栏时替代.trigger(‘create’)或.page()吗?
作者:互联网
我有以下jQuery Mobile HTML代码,导航栏的内容是使用javascript设置的.静态设置时,jQuery mobile设置导航栏的样式,但是稍后在使用javascript设置导航栏(html)的内容时,您必须做一些额外的工作才能使其正常工作:
<div data-role="header">
<h1 id="title">App</h1>
</div><!-- /header -->
<div data-role="content" id="content">
<p>Loading...</p>
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<div data-role="navbar" id="navbar">
<ul id="menu">
</ul>
</div>
</div><!-- /footer -->
</div><!-- /page -->
触发器(‘创建’);通常用于解决使用javascript / ajax设置时未标记样式的问题.但是,它似乎只能在data-role =“ content”内运行,而不适用于#navbar.下面的脚本应该可以工作,但是菜单没有样式设置.
$(function(){
$("#menu").html("<li><a href='#'>Test Styling</a></li>").trigger('create');
});
任何想法如何解决这个问题?我已经尝试过page();和.listview(‘refresh’);没有结果.
解决方法:
追加列表项后,尝试调用navbar方法:
$(function(){
$("#menu").html("<li><a href='#'>Test Styling</a></li>");
$("#navbar").navbar();
});
编辑:
您也可以尝试动态创建导航栏:
var footer = $("#footer-id");
var navBar = $("div", {
"data-role":"navbar",
"html":"<ul><li><a href='#'>Test Styling</a></li></ul>"
}).appendTo(footer).navbar();
标签:dom,jquery-mobile,html,javascript,jquery 来源: https://codeday.me/bug/20191101/1985646.html