Jquery Mobile + iscroll4 + 动态页面加载答案

【问题标题】：Jquery Mobile + iscroll4 + dynamic page loadJquery Mobile + iscroll4 + 动态页面加载
【发布时间】：2013-01-23 17:56:36
【问题描述】：

我是 StackOverflow 的新手，这是我的第一个问题，如果我做错了什么，请见谅。

我的问题是如何让 iScroll 4 在使用 load() 方法动态加载该页面的页面上的多个 div 上工作。

所以把它分解成更简单的东西：

我有一个名为 page.html 的单独页面

<html>
      <body>

            <ul data-iscroll="scroller">
               ..lots of data..
            </ul>

            <ul data-iscroll="scroller">
               ..lots of data..
            </ul>

      </body>
</html>

然后在我的 index.html 页面上，我有所有库的常用标题标签，并且加载良好（我知道它有效，因为当我在 index.html 页面中有列表时 -> iScroll 工作正常。只是不是在列表是动态加载的）

我的 index.html 的正文是

<body>

      <div data-role="page>
            <div data-role="header" data-position="fixed">
                  <h3>header</h3>
            </div>

            <div data-role="content" id="content">
                 <!-- always empty - data will be loaded here -->
            </div>

            <div data-role="footer" data-position="fixed">
                 <h3>footer</h3>
            </div>
      </div>

</body>

页面被加载到内容中（这也有效，因为我可以看到所有内容）

$("#content").load("page.html",function(){
    $("#content").trigger('create');
});

你也知道，我包含的库是

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0-beta.1/jquery.mobile-1.3.0-beta.1.min.css" />
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0-beta.1/jquery.mobile-1.3.0-beta.1.min.js"></script>
<!-- jScroll -->
<script src="iscroll.js" type="text/javascript"></script>
<script src="jquery.mobile.iscrollview.js" type="text/javascript"></script>

当我使用 Chrome 检查元素时，所有数据都显示出来了，但 2 <ul> 并没有像我期望的那样单独滚动。有谁知道我做错了什么？

PS。我也在使用python -m SimpleHTTPServer 8013 的简单服务器上运行它并通过 PhoneGap 运行 Ripple 模拟器来测试屏幕分辨率等，因为这将适用于手机。

【问题讨论】：

标签： jquery mobile dynamic load iscroll4

【解决方案1】：

我希望这可能会帮助您理解和解决您的问题..如果您仍然不清楚，请告诉我，我会进一步解释您...My brief explanation about iScroll is here

【讨论】：