面板无法在所有使用JQuery Mobile的页面上正常工作 [英] panel not working in all pages using JQuery Mobile
问题描述
朋友，我是jQuery mobile的新手，并试图通过使用jquery mobile创建一个网站来学习东西.问题是我使用data-role="panel"在页面上显示导航正常，但是当我跳到同一HTML文件中的另一个页面时，它停止工作了，我不知道这是怎么回事，需要您的帮助. 您可以在此处检查小提琴 .在主页面板上可以正常工作，但是当我单击关于我们"页面时，它会跳到那里，但是面板停止工作
Hi friends I am new in jQuery mobile and trying to learns things by creating a website using 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. 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 :)
推荐答案
如果要从任何页面访问同一面板，则必须将面板div放置在任何data-role="page"之外，然后必须手动对其进行初始化.这称为外部面板.
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. This is called an external panel.
<body>
<div data-role="panel" id="foo" data-theme="a">
<!-- contents -->
</div>
<!-- pages here -->
</body>
请注意，外部面板不会自动继承主题，因此，您需要为其添加data-theme属性.
Note that an external panel doesn't inherit theme automatically, thus, you need to add data-theme attribute to it.
.enhanceWithin()功能用于增强面板内的所有小部件.它们不会自动初始化，因此需要进行初始化.
The .enhanceWithin() function is to enhance all widgets inside the panel. They aren't auto-initialized, so they need to be initialized.
$(function () {
$("[data-role=panel]").enhanceWithin().panel();
});
将该代码放在JQM库之后.
Place that code in head after JQM library.
Demo
这篇关于面板无法在所有使用JQuery Mobile的页面上正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
