JQM 页面加载后，Touchswipe 未正确启动答案

【问题标题】：Touchswipe not initiated correctly after JQM page loadJQM 页面加载后，Touchswipe 未正确启动
【发布时间】：2015-03-04 19:28:34
【问题描述】：

我正在使用 JQM 创建一个混合应用程序。其中一页是我使用Touchswipe的图片库。

如果我直接打开页面，一切正常。但是，如果我通过单击另一个页面的链接导航到该页面，JQM 会使用 Ajax 加载该页面，并且 swipe 未正确初始化。如果我尝试滑动，我会收到此错误：

只有当我按 F5 并重新加载页面时它才有效。

这是我使用的代码：

$(document).on( "pagecontainerbeforeshow", function( e, ui ) {
  Gallery.init();
});

var Gallery = {
  imgContainer: null,
  (...),

  init: function() {
    this.imgContainer = $('#imageContainer');
    (...)
    console.log('This msg shows');

    this.imgContainer.swipe({
        threshold        : 100,
        triggerOnTouchEnd: true,
        allowPageScroll  : "horizontal",
        swipeStatus      : function (event, phase, direction, distance, duration) {
            Gallery.swipe(event, phase, direction, distance, duration)
        }
    });
  },

  swipe: function(...){
    console.log('I only get this by hitting F5');
  }

};

非常感谢任何帮助！

【问题讨论】：

可能是 pagecontainerbeforeshow 无法触发 (Gallery.init();) 因为页面尚未在 Dom 中。将 ($(document).on( "pagecontainerbeforeshow") 更改为 ($(document).on( "pagecontainertransition") 看看是否有帮助
不，仍然得到同样的错误。 Gallery.init()fires。它甚至运行this.imgContainer.swipe()，但随后出现此错误。
检查这里看看你是否以正确的方式加载了插件 -- stackoverflow.com/questions/9794927/…
我希望它是那么简单。不幸的是，它是在 jQuery 和 JQM 之后加载的。

标签： jquery jquery-mobile touchswipe

【解决方案1】：

所以事实证明这是加载脚本的顺序。但不像described in this thread。

最初我是在我的画廊页面上加载我的脚本：

// Header
<script src=jquery
<script src=jquery.mobile

//Footer
<script src=jquery.touchSwipe

但是因为 JQM 使用 Ajax 检索页面，所以从不加载 touchSwipe。因此，通过将它添加到我的索引，当 JQM 获取 apge 时它已经加载，我仍然需要在我的画廊页面上“加载”它，以防应用程序在该页面上关闭并重新打开。

【讨论】：