Cordova 应用程序中的 Hammer.js 事件仅在第二次尝试时触发答案

【问题标题】：Hammer.js event in a Cordova app firing only on second attemptCordova 应用程序中的 Hammer.js 事件仅在第二次尝试时触发
【发布时间】：2014-01-18 21:04:02
【问题描述】：

在我的Cordova 应用程序中，我像这样刷新屏幕：

$('.main-panel').empty();
//using underscore template
$('.main-panel').html(_.template($("#tpl-alertpanel").html(),{alerts : alerts}));

//wire hammer.js event
Hammer($('#alertpanel')).on("swipedown dragdown", function() {
   console.log('>>>>>>>>>>>>' + $(this).attr('id') + $(this).scrollTop());
});

问题：

在上述刷新之后，swipedown 事件仅在第二次尝试时触发 - 这意味着我必须swipedown 一次没有效果，然后再次触发事件。或者我可以先点击然后滑动以触发滑动事件。

我认为这可能与我正在清空 $('.main-panel') 下的 DOM 元素并动态替换它有关。

我尝试像这样以编程方式触发first tap，但没有任何效果：

$('.main-panel').click(); 
$('.main-panel').focus();

我正在 Android 4.4.2

上对此进行测试

任何指针将不胜感激。

【问题讨论】：

只是好奇，为什么在你用 html() 替换内容之后才调用 empty()？
@QuickFix - 清空旧数据，然后显示新数据
是的，但是如果有旧数据，html会替换掉旧数据，所以不会为空添加不是很有用的dom操作。
@QuickFix - 你是对的 - jquery 文档说 - When .html() is used to set an element's content, any content that was in that element is completely replaced by the new content. Additionally, jQuery removes other constructs such as data and event handlers from child elements before replacing those elements with the new content. 我确实尝试过不使用 $('.main-panel').empty() - 这并没有改善情况

标签： javascript cordova hammer.js

【解决方案1】：

我发现了一种解决方法 - 不确定这是否是正确的解决方案。

如果我在 setTimeout 中刷新我的主面板，Hammer 事件会在第一次尝试时触发。

setTimeout(function(){
    refreshMainPanel();
}, 100);

【讨论】：