面板在使用JQuery Mobile的所有页面中都不起作用

时间:2014-02-18 14:46:21

标签: jquery jquery-mobile panel

嗨朋友我是jQuery mobile的新手,并试图通过使用jquery mobile创建一个网站来学习。问题是我使用data-role="panel"来显示我的页面上的导航它的工作正常但是当我跳转到同一个HTML文件中的另一个页面时它停止工作我不知道什么是破解这个问题需要你的帮助。的 You can check fiddle here 即可。在主页面板工作正常但当我点击关于我们页面时它跳转但面板停止工作

请帮帮我们..提前致谢:)

1 个答案:

答案 0 :(得分:10)

如果您想从任何页面访问同一个面板,您必须将面板div置于任何data-role="page"之外,然后您必须手动初始化它。这称为外部面板

<body>
  <div data-role="panel" id="foo" data-theme="a">
    <!-- contents -->
  </div>

  <!-- pages here -->
</body>

请注意,外部面板不会自动继承主题,因此您需要向其添加data-theme属性。

.enhanceWithin()功能是增强面板内的所有小部件。它们不是自动初始化的,因此需要进行初始化。

$(function () {
  $("[data-role=panel]").enhanceWithin().panel();
});

将该代码置于JQM库之后。

  

<强> Demo