簡體   English   中英

setTimeout與事件綁定/解除綁定; 有什么更有效的?

[英]setTimeout vs. Event binding/unbinding; what's more efficient?

我遇到需要將jQuery的$.fn.one()函數用於click事件的情況,但是我不希望它應用於事件的下一次出現(就像通常那樣),我希望它之后立即將其應用於事件,然后將其自身解除綁定.one()通常與.one()一樣)。

我不希望將.one()應用於第一次出現的原因是因為我是從冒泡階段中較早時調用的事件處理程序綁定到document的,所以它將在第一次document時成為一部分同一事件。 我想知道下次點擊事件何時發生。

注意:我不想使用.stopPropagation()因為它可能會破壞我應用程序的其他部分。

這是我想出的兩個選項,盡管似乎必須有一個更優雅的解決方案。

雙綁定方法:

$(document).one('click', function() {
  $(document).one('click', callback);
});

setTimeout方法:

setTimeout(function() {
  $(document).one('click', callback);
}, 1);

兩種方法都可以正常工作,但這是我的問題。 我不知道setTimeout或頻繁事件綁定和取消綁定對性能的影響。 如果有人知道,我很想聽聽。 但更重要的是,我想就如何針對此類未來情況自己衡量這些東西提出一些建議。

我喜歡http://jsperf.com之類的網站,但我不知道它是否真的對測量像這樣的東西有用。

顯然,如果有人看到更好的解決方案,我很樂意聽到。

我發現雙綁定方法非常優雅-我認為它可以准確反映您的實際意圖,並且只需要兩行代碼。

但是另一種方法不是使用.one()而是可以使用.on()並更新與第一個事件關聯的事件對象,並添加一個標志,以便回調在第一次調用時將被忽略:

function oneCallback(e) {
    if (e.originalEvent.firstTimeIn)
        return;

    alert("This is the one after the current event");
    $(document).off("click", oneCallback);
}

$("div.source").click(function(e) {
    e.originalEvent.firstTimeIn = true;
    $(document).on("click", oneCallback);   
});

演示: http//jsfiddle.net/q5LG4/

編輯:為了解決您對不修改event對象(或任何您不擁有的對象)的擔憂,您可以在閉包中存儲firstTime標志。 這是一個相當狡猾的.oneAfterThis()插件,采用了這種方法:

jQuery.fn.oneAfterThis = function(eventName, callback) {
    this.each(function() {
        var first = true;
        function cb() {
            if(first){
                first = false;
                return;
            }
            callback.apply(this,[].slice.call(arguments));
            $(this).off(eventName,cb);
        }
        $(this).on(eventName, cb);
    });
};

$(someseletor).oneAfterThis("click", function() { ... });

我敢肯定,這樣做可以做得更好(也許我應該去看看jQuery如何實現.one() ),但是我只是想快速介紹一下作為概念證明。

演示: http//jsfiddle.net/q5LG4/1/

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM