Javascript AJAX导航上的jQuery Mobile.popup（）注入

我正在通过.js插入jQM弹出窗口小部件，就像这样

// jQM popup settings injection
// the variable "g_html_popup_settings" contains the markup for the settings popup(s)
// this var is established in application.html.erb
// popup injection 
$(document).on('pagebeforecreate', function () {
    var popupDOM = $("[data-role=popup]").length;
    if (popupDOM === 0) {
        // using enhanceWithin() as it triggers an update in presentation 
        // for injected widgets
        $.mobile.pageContainer.prepend(g_html_popup_settings).enhanceWithin();
        // we use .popup() as of jQM 1.4.3
        //$("#iHODPopupSettings").popup("open");
        $('a[data-rel="popup"]').on("click", function () {
          $("#iHODPopupSettings").popup("open", {
            transition:"pop"
          });
        //console.log("creating popup...");
        }); //else {
        //console.log("There is a popup in the DOM!!");
    }
});
// /jQM popup settings injection

var g_html_popup_设置是ruby/rails处理的html。 我已经能够以这种方式在我的应用程序的所有区域实现面板和工具栏jQM小部件。 此小部件不同，因为弹出窗口必须绑定到单击事件以生成模式/弹出窗口。 当导航到使用jQM默认AJAX用法的页面时，我会丢失打开弹出窗口的按钮的功能。上述注入小部件的方法适用于使用

data-ajax="false"

但是，我希望有一个解决方案，我不必担心显示的页面是否通过AJAX进入。我不知道“pagebeforecreate”事件是否阻止我对小部件进行某种通用表示，不管pagecontainer负载是否为AJAX

所有按钮都是使用以下标记创建的

  <!-- settings modal button -->
  <a href="#IHODPopupSettings" data-rel="popup" data-position-to="window" 
  class="ui-btn ui-btn-inline ui-mini ui-corner-all ui-btn-icon-left ui-icon-gear">Settings
  </a>
  <!-- /settings modal button -->

我们将非常感谢您对此问题的任何帮助或见解。

---

提前感谢您查看此内容。

我猜-虽然不确定-您多次追加同一弹出窗口，请在页面外部尝试此$.selector，e.target.length，并将$.mobile.pageContainer替换为$e.target。或任何其他选项，点击后，动态注入弹出窗口，并在关闭后将其删除。嘿，奥马尔！谢谢你的建议。我试图实现它们，但无法确切地说出我应该使用的顺序。我得到了一个未定义的e错误。或事件。在Firebug/inspector中进一步检查之后，我注意到弹出窗口的代码/标记块仍然存在于DOM中。然后，我在上面的函数中添加了一个else语句，以重新创建click处理程序，使其可用，即使我没有初始化弹出窗口小部件。这似乎奏效了。我想我的代表阻止我以正确的格式发布代码，但我也会努力的；你错过了函数中的e$document.onwhatever，函数e{console.loge.target；}；为了澄清上述问题，检查器中提供了AJAX和非AJAX jQM导航的弹出代码/标记。我没有看到任何重复或重复的地方。在提出这个解决方案时，我确实看到有人提到内存泄漏等问题。希望这种注入弹出窗口的方式不会造成这种情况。我不知道ruby在导航方面是如何工作的，是否启用了Ajax。如果您能够注册/附加单击事件，那么问题就很容易解决。但是，请确保事件/侦听器没有重复。要找到答案，只需在所有视图/页面中存在的一个元素/ID上添加一个单击事件，您想要处理的任何函数都应该只工作一次，而不是更多。下面是一种动态注入弹出窗口的方法