javascript - jQuery Mobile 重复触发器解释

Question

据我了解，当您在 jQuery Mobile 中创建监听器时，如下所示:

$('.this-class').on('swipe',tapHandler);

tapHandler 将运行两次。为了消除这个问题我见过多种解决方案，比如:

$('.page-card').off('swipe').on('swipe',tapHandler);

或

将其包装在 pageinit 的一侧，以便在您在 pagebeforeshow 中创建动态内容时消除缓存问题，如 here 所示。 .

我也明白，甚至冒泡也可以在这里发挥作用。

但是，我希望有人能够解释为什么这个已知存在，以及为什么 jQuery 的贡献者在知道其缺点的情况下决定采取这条路线。

Answer 1

首先让我们讨论 jQuery Mobile 的工作原理。与使用 jQuery 的普通网页不同，jQuery Mobile 使用 ajax 将页面加载到 DOM，可以加载一页或多页。因此，经典文档就绪是无用的，因此 jQM 开发人员创建了页面事件。

页面事件对于这个故事来说是主要的。虽然文档就绪每页仅触发一个，但大多数页面事件将触发多次，具体取决于重新/访问页面的时间。

让我们回到 on 函数(以及所有其他类似函数，例如 bind 、 delegate ，已弃用 live )。同样，在处理普通页面时，您永远不会遇到这种情况，因为同一页面永远不会保留在 DOM 中。

jQuery Mobile 来了。如果您在页面显示(或类似的页面事件)中使用绑定(bind)方法，则该事件将一遍又一遍地绑定(bind)。基本上 on 方法从来没有打算像这样使用。

如果您想了解更多有关预防方法的信息，请查看我的其他 answer ，查找主题:防止多个事件绑定(bind)/触发