Jquery mobile Jquery Mobile-页面转换速度慢

使用jquerymobileim使用持久化页眉和页脚。页脚导航具有选项卡，当您单击选项卡时，它将通过ajax加载页面。问题是从一个页面到另一个页面的转换非常慢，即ajax加载具有特定id的div。页面转换需要2-5秒。当我点击一个标签时，它会高亮显示一种不同的颜色，但什么也没有发生，然后几秒钟后就会发生转换。有时，如果您单击以加快布局打断并显示页脚。我用最新版本的jquery mobile在ipad上做这件事。jquerymobile真的很慢吗？等到第五次失败会有很大的不同吗

更新

下面是一段代码：

<div data-role="page" id="page1">
  <div data-role="header" data-position="fixed">
    <h1>Page Title</h1>
    <a href="#dialog" data-transition="slidedown" data-icon="check">Add</a>
  </div>
  <div data-role="content">
    <ul data-role="listview">
      <li data-role="list-divider"><span class="ui-li-count">2</span></li>
      <li>
        <h3>Stephen Weber</h3>
        <p><strong>You've been invited to a meeting at Filament Group in Boston, MA</strong></p>
        <p>Hey Stephen, if you're available at 10am tomorrow, we've got a meeting with the jQuery team.</p>
        <p class="ui-li-aside"><strong>6:24</strong>PM</p>
      </li>
</ul>
  <div data-role="footer" class="nav-glyphish-example" data-id="myfooter" data-position="fixed"> 
    <div data-role="navbar" class="nav-glyphish-example" data-grid="b">
      <ul>
        <li><a href="#page1" data-transition="reverse slide" id="chat" data-icon="custom" class="ui-btn-active ui-state-persist">Link 1</a></li>
        <li><a href="#page2" data-transition="slide" id="email" data-icon="custom">Link2</a></li>
        <li><a href="#page3" data-transition="slide" id="skull" data-icon="custom">Link 3</a></li>
      </ul>
    </div>
  </div>

<div data-role="page" id="page2">
  <div data-role="header" data-position="fixed">
    <h1>Page Title</h1>
    <a href="#dialog" data-transition="slidedown" data-icon="check">Add</a>
  </div>
  <div data-role="content">
    <ul data-role="listview">
      <li data-role="list-divider"><span class="ui-li-count">2</span></li>
      <li>
        <h3>Stephen Weber</h3>
        <p><strong>You've been invited to a meeting at Filament Group in Boston, MA</strong></p>
        <p>Hey Stephen, if you're available at 10am tomorrow, we've got a meeting with the jQuery team.</p>
        <p class="ui-li-aside"><strong>6:24</strong>PM</p>
      </li>
</ul>
  <div data-role="footer" class="nav-glyphish-example" data-id="myfooter" data-position="fixed"> 
    <div data-role="navbar" class="nav-glyphish-example" data-grid="b">
      <ul>
        <li><a href="#page1" data-transition="reverse slide" id="chat" data-icon="custom" class="ui-btn-active ui-state-persist">Link 1</a></li>
        <li><a href="#page2" data-transition="slide" id="email" data-icon="custom">Link2</a></li>
        <li><a href="#page3" data-transition="slide" id="skull" data-icon="custom">Link 3</a></li>
      </ul>
    </div>
  </div>

页面标题

2

斯蒂芬·韦伯
您被邀请参加马萨诸塞州波士顿灯丝集团的一次会议

嘿，Stephen，如果你明天上午10点有空，我们要和jQuery团队开会

下午6:24








页面标题

2

斯蒂芬·韦伯
您被邀请参加马萨诸塞州波士顿灯丝集团的一次会议

嘿，Stephen，如果你明天上午10点有空，我们要和jQuery团队开会

下午6:24

有时，如果单击以加快布局打断和页脚 显示：

这是一个已在此处解决的问题，尚未找到解决方案：

---

关于加载时间，这真的很奇怪，试着将错误集中在删除部分代码上，并缩小加载时间过长的位置和原因。。。希望这有帮助

我也面临同样的问题。禁用奇特的屏幕转换为我修复了它

要普遍做到这一点：

$.mobile.defaultPageTransition = 'none';

---

您多次使用相同的ID。对我来说，这也造成了类似的问题。尝试删除/更改重复的ID

例如，您只需复制粘贴的此部分，以便将其复制到第二页：

<li><a href="#page1" data-transition="reverse slide" id="chat" data-icon="custom" class="ui-btn-active ui-state-persist">Link 1</a></li>
<li><a href="#page2" data-transition="slide" id="email" data-icon="custom">Link2</a></li>
<li><a href="#page3" data-transition="slide" id="skull" data-icon="custom">Link 3</a></li>

提供一些代码，说明您真正在做什么？如何提供锚？您是否使用页面定义加载页面？添加一些代码，会很有帮助。尝试删除页面转换动画，看看它是否能更快地加载页面。这将缩小ajax请求花费的时间还是动画本身的范围。这会对页面之间的加载产生任何影响吗？实际上只是删除了scrollview插件，速度并没有快多少。基本上，我在页脚中有标签，当我点击转到另一个标签时，它会在那里停留几秒钟。然后发生页面转换，在本例中为幻灯片。然后单击页脚中的上一个选项卡，它再次挂起几秒钟，然后切换回上一个选项卡。这不仅看起来/感觉笨拙，而且对双击的人来说是开放的，当这种情况发生时，奇怪的事情就会发生，比如页面的一半消失了，页脚消失了，或者什么都没有发生。试着缩小错误的来源（排除代码中的逐步部分），在我看来，这不是一种正常的JQM行为。IPad本身运行正常吗？背景中有什么让它变慢或让它等待的吗？我试着尽可能地把它剥离下来，仍然是同一个问题。我有一个ipad1和一个ipad2，但都有同样的问题。运气好吗？我们也有同样的问题。RC3的性能得到了极大的提高。升级jquerymobile也会有所帮助。