jQuery中的默認事件處理程序

Question

我正在尋找一種方法來實現以下功能。我可以建立一些機制來做到這一點，我正在尋求一些內置的或者非常簡單的方法，如果它存在並且我錯過了它。

編輯： 請注意，我正在討論隨機對象中的事件，而不是DOM元素。根據可能的副本中的建議，無法使用父級等來管理事件順序。

編輯2： 也許所有的處理程序，被稱爲回調？還是一個總是最後執行的處理程序？

考慮：

var someObject={}; 
$(someObject).on("event",function() { console.log('Default handler'); }); 
... 
$(someObject).on("event",function() { console.log('Other handler'); }); 

做當：

$(someObject).triggerHandler("event"); 

輸出是：

Default handler 
Other handler 

我們都知道這一點。問題是：如果我想將第一個事件設置爲「默認」處理程序，如果沒有其他事件處理程序（在那裏沒有問題）要執行，或者其他處理程序沒有停止事件傳播這是問題）。

我正在尋找一種方法能夠像做：

$(someObject).on("event",function(ev) { ev.preventDefault(); }); 

，並防止第一事件處理程序的執行。在這個例子中沒有給出執行順序。反轉執行順序不是正確的方法。

TL; DR

是否可以設置一個默認的處理器，一個被稱爲萬一有沒有其他的處理程序和事件沒有被取消？

編輯3：爲了給你一個更好的主意，目前的做法是以下（名稱是由這個例子）：

var eventCanceled=false; 
function doTheEvent() { 
    $(someObject).triggerHandler("event"); 
    if(!eventCanceled) defaultEventHandler(); 
} 
//To be called inside the handlers to stop the default handler 
function cancelTheEvent() { 
    eventCanceled=true; 
} 

我只是想擺脫這一點，並能直接使用triggerHandler。

Answer 1

您可以添加一個參數來設置您要在triggerHandler函數內執行的代碼。

你可以參考這個線程添加參數。 jQuery: receive extraParameters from triggerHandler()

Answer 2

雖然有a way to detect如果調用preventDefault（），則不存在「默認處理程序」這樣的事情。事件處理程序按照它們註冊的順序執行。所以第一個註冊的是第一個被執行的。

如果您的「默認處理程序」不需要同步執行，您可以延遲「默認處理程序」在所有其他處理程序完成後執行，並在任何其他處理程序恢復，如果有必要：

var defaultHandlerTimeout; 
$element.on('event', function() { 
    defaultHandlerTimeout = setTimeout(function() { 
    // your actual handler 
    }); 
}); 

$element.on('event', function() { 
    // prevent the "default handler" from being executed 
    clearTimeout(defaultHandlerTimeout); 
}); 

Answer 3

jQuery確實在內部存儲了所有的事件，您可以使用$._data(elem,'events')訪問特定的元素事件。

這是否會幫助您的情況我不知道，但值得深入挖掘。我個人從來沒有發現需要使用它。

見https://stackoverflow.com/a/2518441/1175966

Answer 4

希望這是你在找什麼。這被稱爲觀察者模式。

var someObj = {}; 
 
someObj.eventCallbackList = {}; 
 
someObj.createEventObject = function(name) { 
 
    return { 
 
    type: name, 
 
    preventDefault: function() { 
 
     this.callDefault = false; 
 
    }, 
 
    callDefault: true 
 
    } 
 
} 
 
someObj.on = function(eventName, callback, defaultFlag) { 
 
    if (!this.eventCallbackList[eventName]) { 
 
    // there can be multiple other handlers 
 
    this.eventCallbackList[eventName] = { 
 
     other: [], 
 
     default: null 
 
    }; 
 
    } 
 

 
    if (defaultFlag) { 
 
    this.eventCallbackList[eventName]['default'] = callback; 
 
    } else { 
 
    this.eventCallbackList[eventName]['other'].push(callback); 
 

 
    } 
 
} 
 

 
someObj.triggerHandler = function(eventName) { 
 
    var event = this.createEventObject(eventName); 
 
    var callbacks = this.eventCallbackList[eventName]; 
 

 
    if (callbacks) { 
 
    if (callbacks['other']) { 
 
     for (var i = 0; i < callbacks['other'].length; i++) { 
 
     callbacks['other'][i](event); 
 
     } 
 
    } 
 

 
    if (event.callDefault && callbacks['default']) { 
 
     callbacks['default'](event); 
 

 
    } 
 
    } 
 

 

 
} 
 

 

 

 

 
// Test 
 

 
someObj.on('myCustomEvent', function(event) { 
 
    console.log('OtherHandler'); 
 
    event.preventDefault(); 
 
}); 
 

 
someObj.on('myCustomEvent', function(event) { 
 
    console.log('default'); 
 
}, true); 
 

 
$(document).on('click', function() { 
 
    someObj.triggerHandler('myCustomEvent'); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>