0

例如，我的文档中有两个带有面板的页面，面板具有相同的名称，如下所示：

<html>
  ...
  <body>
    <div data-role="page" id="page1">
      <div data-role="panel" id="left-panel">...</div>
      <div data-role="panel" id="right-panel">...</div>
      ...
    </div>
    <div data-role="page" id="page2">
      <div data-role="panel" id="left-panel">...</div>
      <div data-role="panel" id="right-panel">...</div>
      ...
    </div>
  </body>
</html>

我可以让刷卡在加载的第一页上工作，但是一旦我加载一个新页面，刷卡就会中断给我这个错误Uncaught Error: cannot call methods on panel prior to initialization; attempted to call method 'open'。我尝试了此处概述的解决方案，但它对我不起作用。我正在使用此代码滑动打开面板：

 $("#page1").on("swipeleft swiperight", function(e) {
    if ($.mobile.activePage.jqmData("panel") !== "open") {
        if (e.type === "swipeleft") {
            $("#right-panel").panel("open");
        } else if (e.type === "swiperight") {
            $("#left-panel").panel("open");
        }
    }
});

$("#page2").on("swipeleft swiperight", function(e) {
    if ($.mobile.activePage.jqmData("panel") !== "open") {
        if (e.type === "swipeleft") {
            $("#right-panel").panel("open");
        } else if (e.type === "swiperight") {
            $("#left-panel").panel("open");
        }
    }
});

在里面$(document).on("pageinit", function(){... it's at the end of this function});我认为因为我将滑动侦听器绑定到每个页面，所以可以计算出每个页面都有滑动功能但没有这样的运气。

有什么办法可以做我正在尝试的事情吗？我尝试了多种解决方案，例如每次更改页面时仅加载滑动侦听器代码，.page在每个页面上使用类 ( ) 并使用滑动侦听器代码的一个实例，但似乎没有任何效果。

4

1 回答 1

0

所以我想通了，@alkis 你部分正确，多个 id 与 jQuery Mobile 混淆了，但除了区分面板 id 之外，我还必须更改我的 javascript 文件的绑定$(document).ready(function(){...});，然后将每个滑动处理程序包装在它自己的$("#pagenamehere").on("pageinit", function(){...});捆绑。+1 给你@alkis，如果你没有提到多个 id，我就不会明白，我只是想，因为它们是单独的页面，我可以使用相同的 id 并且只有一个滑动处理程序，没有这样的运气。谢谢。

于 2013-06-16T16:25:59.980 回答