javascript - JavaScript 中的自定义事件

Question

是否可以在 JavaScript 中创建将在某些条件下触发的自定义事件（例如，三次单击或滑动）？也许要听这个自定义事件：

addEventListener('trplclick', handler, false); 

因此，例如，仅当在 600 毫秒内完成 3 次点击时才会调用处理程序。

Answer 1

您需要自己触发triplclick事件。triplclick监听单个点击事件，计算它们，并在有意义时触发。

看看document.dispatchEvent。

我正在使用 jQuery 来演示这个概念，但您不需要：

var count = 0;
var resetTimeout - 1;
$(element).on("click", function(){
    count++;
    clearTimeout(resetTimeout);
    if (count === 3)
    {
        count = 0;
        $(element).trigger("trplclick");
    }
    else 
    {
        resetTimeout = setTimeout(function(){
            count = 0; // Don't count if no click within the last second.
        }, 1000);
    }
});

Answer 2

在此处查看类似问题：如何在 JavaScript 中侦听三次点击？

基本上它所做的是将双击事件和单击事件组合在一起以模拟三次单击。当双击事件触发时，设置一个 200ms 的超时时间。如果出现以下点击，请检查计时器是否超时。如果在上一次双击后 200 毫秒后发生此单击（此时，双击处理程序中的计时器设置为 null），则丢弃此单击，否则将其计为三次单击。

对于一般设置自定义事件，我将向您推荐 Nicholas C. Zakas 的博客文章：http ://www.nczonline.net/blog/2010/03/09/custom-events-in-javascript/