Jquery mobile 如何在jQuery mobile中创建外部面板？

我正在尝试创建一个多页面应用程序，并且正在使用JQuery mobile，我有两个面板使用JQuery mobile：

但是，将这些面板添加到我创建的每个页面中会很麻烦。 所以我需要帮助在我将要创建的所有页面中使用这些面板。

---

提前谢谢

这个脚本适合我

$(document).on("pagecreate", ".demo-page", function() {
var panell = '<div data-role="panel" id="left-panel" data-position="left" data-display="reveal" data-theme="a"><ul data-role="listview" data-inset="true"><li><a href="index.html" data-transition="slide">Home</a></li><li><a href="bio.html" data-transition="slide">About</a></li><li><a href="news.html" data-transition="slide">News</a></li></ul></div>';
$.mobile.pageContainer.prepend(panell);
$("#left-panel").panel().enhanceWithin();

var panelr = '<div data-role="panel" id="right-panel" data-position="right" data-display="reveal" data-theme="a"><ul data-role="listview" data-inset="true"><li><a href="index.html" data-transition="slide">Home</a></li><li><a href="bio.html" data-transition="slide">About</a></li><li><a href="news.html" data-transition="slide">News</a></li></ul></div>';
$.mobile.pageContainer.prepend(panelr);
$("#right-panel").panel().enhanceWithin();
});

$（document）.on（“页面创建”，“演示页面”，函数（））{
var Panel='
/ul>'；
$.mobile.pageContainer.prepend（panel）；
$（“#左面板”）.panel（）.enhanceWithin（）；
var Panel='
”；
$.mobile.pageContainer.prepend（panler）；
$（“#右面板”）.panel（）.enhanceWithin（）；
});

查看此演示：如果查看源代码，您将看到只需初始化面板$（“body>[data role='panel']）；谢谢你的回复！这对我很有用：

$(document).on("pagecreate", ".demo-page", function() {
var panell = '<div data-role="panel" id="left-panel" data-position="left" data-display="reveal" data-theme="a"><ul data-role="listview" data-inset="true"><li><a href="index.html" data-transition="slide">Home</a></li><li><a href="bio.html" data-transition="slide">About</a></li><li><a href="news.html" data-transition="slide">News</a></li></ul></div>';
$.mobile.pageContainer.prepend(panell);
$("#left-panel").panel().enhanceWithin();

var panelr = '<div data-role="panel" id="right-panel" data-position="right" data-display="reveal" data-theme="a"><ul data-role="listview" data-inset="true"><li><a href="index.html" data-transition="slide">Home</a></li><li><a href="bio.html" data-transition="slide">About</a></li><li><a href="news.html" data-transition="slide">News</a></li></ul></div>';
$.mobile.pageContainer.prepend(panelr);
$("#right-panel").panel().enhanceWithin();
});