Question

我正在尝试将一些动态内容添加到我的JQuery移动页面的底部。内容由JavaScript文件填充。用户通过单击另一页面上的链接导航到此页面。当他们点击该链接时，会显示下面定义的页面。奇怪的是，当用户通过从上一页导航到达时，动态内容不会显示。但是，如果我刷新页面，则会显示内容。或者，如果我直接通过网址导航到该页面，则会显示内容。在所有三种情况下，控制台中都不会报告任何JavaScript错误。我做错了什么？

page.html中

<body>
  <div id="myPage" data-role="page">
    <div data-role="header">
      <h1>Testing</h1>
      <a href="#" data-icon="plus" data-iconpos="notext" class="ui-btn-right jqm-plus" onclick="addButton_Click();">Add</a>
    </div>

    <div data-role="content">
      <div id="noResults">No Results</div>
      <ul id="recentResults" data-role="listview"></ul>
    </div>

    <div data-role="footer" data-position="fixed">
      <div id="dynamicContent">
        <script type="text/javascript" src='http://www.mydomain.com/footerContent.js'>   
        </script>
      </div>
      <div data-role="navbar">
        <ul>
          <li><a href="#" class="ui-btn-active ui-state-persist">Tab 1</a></li>
          <li><a href="/tab2" rel="external">Tab 2</a></li>
          <li><a href="/tab3" rel="external">Tab 3</a></li>
        </ul>
      </div>
    </div>

    <script type="text/javascript">
      function addButton_Click() {
        $.mobile.changePage("/add", { transition: "slide" });
      }
    </script>
  </div>
</body>

Answer 1

将您的js添加到文档的头部。然后在pageinit上添加动态内容。 JQM将该内容与page1放在同一个dom中，我相信它会忽略你的外部脚本。

<head>
<link ....
<script ....
<script .....
<script>
$('body').delegate('#myPage','pageinit',function(){
    $('#dynamicContent').append('add ground breaking dynamic content here');
});
</script>
</head>

在JQuery Mobile中动态显示控件

1 个答案: