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

Question

Hi friends I am new in jQuery mobile and trying to learns things by creating a website using jquery mobile. 嗨朋友我是jQuery mobile的新手，并试图通过使用jquery mobile创建一个网站来学习东西。 The problem is I used data-role="panel" to show navigation on my page its working fine but when i jump to another page which is in same HTML file its stop working I dont know what is the matter for crack this issue need your help. 问题是我使用data-role="panel"来显示我的页面上的导航工作正常但是当我跳转到另一个页面时，它在同一个HTML文件中停止工作我不知道什么是破解这个问题需要你救命。 You can check fiddle here . 你可以在这里查看小提琴 。 On home page panel work fine but when i click on about us page its jump there but panel stops working 在主页面板工作正常，但当我点击关于我们页面时它跳转但面板停止工作

Please help me guys .. Thanks in advance :) 请帮帮我们..先谢谢:)

Answer 1

If you want to access the same panel from any pages, you have to place panel div outside any data-role="page" , and then you have to initialize it manually. 如果要从任何页面访问同一面板，则必须将面板div放在任何data-role="page" ，然后必须手动初始化它。 This is called an external panel . 这称为外部面板 。

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

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

Note that an external panel doesn't inherit theme automatically, thus, you need to add data-theme attribute to it. 请注意， 外部面板不会自动继承主题，因此，您需要向其添加data-theme属性。

The .enhanceWithin() function is to enhance all widgets inside the panel. .enhanceWithin()函数用于增强面板内的所有小部件。 They aren't auto-initialized, so they need to be initialized. 它们不是自动初始化的，因此需要进行初始化。

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

Place that code in head after JQM library. 将代码放在JQM库之后。

Demo 演示

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

问题描述

1 个解决方案

解决方案1
10 已采纳 2014-02-18 14:57:56

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

问题描述

1 个解决方案

解决方案1 10 已采纳 2014-02-18 14:57:56

解决方案1
10 已采纳 2014-02-18 14:57:56