我想通过点击jQuery Mobile中的按钮来加载div容器中另一个文件夹中的页面内容(例如:“files / pages / example.html”)!
怎么做?
<div data-role="page"> <div id="container" data-role="content"><button id="clickButton">Click me!</button></div> </div>
解决方法
$.mobile.loadPage是您需要的方法.它允许您加载外部html文件并将其插入到dom中.此方法的默认设置是将其作为整个页面加载,因此您必须指定将其加载到dom元素中的选项.这是一个示例(和未经测试的)代码:
$('#clickButton').on("click",function(){ $.mobile.loadPage("theURLofThePage",{pageContainer: $('#container')}) });
现在,不要忘记跨域安全问题.我设法通过添加以下内容在firefox中完成此工作:
$("#landingPage").live('pageinit',function() { jQuery.support.cors = true; $.mobile.allowCrossDomainPages=true; });
此外,您正在加载的页面必须包含在data-role = page div中(假设它具有id =’secondPage’).加载后,触发data-role = page,id = secondPage div:
$('#secondPage").trigger('pagecreate');