我如何防止touchend事件明显被浏览器“记住”并随后在不适当的时间触发?

问题描述 投票:1回答:1

编辑

基于观点的数量和完全缺乏回应,我不得不假设我在传达我的问题方面做得很差。我现在将尝试纠正该问题。

我用新的tap方法扩展了HTMLElement原型,如下所示:

HTMLElement.prototype.tap = function (func) {
    this.addEventListener("touchend", func, false);
};

我还在jQuery中创建了一个自定义tap事件:

$(document).delegate("*", "touchend", function (e) {
    $(this).trigger("tap");
});

我还创建了一个名为tap

的jQuery插件
$.fn.tap = function (func) {
    this.bind("tap", func);
};

如果我尝试将其中任何一个与包含警报语句的回调函数一起使用,则回调将执行两次。我点击该元素以弹出警报。我点击警报中的“确定”按钮以将其关闭。下次我点击屏幕时,无论等待多长时间,警报都会再次弹出。这次点击“确定”按钮似乎并没有设置另一个重复。

但是,如果回调函数不包含警报语句(例如,我改用console.log语句,则回调仅执行一次。

有人知道解决此问题的方法吗?我将尝试从内部释放事件处理程序,然后再重新绑定它,但这仅是破解,即使成功也可以。

我宁愿以“正确”的方式做事。 :-)

原始

我刚刚编写了一个“ tap”函数,可以通过扩展HTMLElement或Element原型以及一个自定义的“ tap”事件和“ tap”插件来使用jQuery来使用。在我决定使用一个简单的警报语句作为测试代码之前,我一直以为这是我的手提包。

[当我在测试页上将它们与某些元素一起使用时,当我第一次“点击”该元素时,它们会正确触发,但是在我触摸警报的“确定”按钮之后出现问题,然后在任何时间之后,点击再次屏幕,此时事件处理程序将再次触发。

起初我以为这是我的自定义代码,但是当我使用以下非常基本的JavaScript进行尝试时,我能够复制完全相同的问题。

document.getElementById("some-element").ontouchend = function (e) {
    alert("Howdy doody!");
};

我想这与以下事实有关:我必须再次触摸屏幕以在警报上执行“ OK”,同时从技术上讲仍在事件处理程序“内部”(因为警报实际上是在“阻塞”事件处理程序。处理程序功能的完成)。

以下行为略有不同的代码无法复制该行为,这似乎支持了我的想象。 :-)

document.getElementById("some-element").ontouchend = function (e) {
    console.log("Howdy doody!");
};

如果我将上述代码包含在页面中,并在触发回调后触摸该元素,则不会重复触发该回调函数,这与之前的代码块不同,在该代码块中,我会再次看到警报单击“确定”后,下次下次点击屏幕的时间无论我点击页面上的何处

确实是一个奇怪的问题,而且我无法找到任何有关可能发生这种情况的信息。有人知道发生了什么吗?

javascript ios callback touch dom-events
1个回答
3
投票

我相信在触摸端触发的可视化全页警报正在干扰触摸事件周期。屈服于DOM后,尝试调用警报。例如。

setTimeout(function() {
    alert('btn clicked');
}, 0);
© www.soinside.com 2019 - 2024. All rights reserved.