如何觸發jQuery的自定義事件，傳遞原始事件和數據

我想從本地事件的處理程序中觸發一個自定義事件，在這些條件下：如何觸發jQuery的自定義事件，傳遞原始事件和數據

我希望處理程序是形式：function(event, arg) {}，其中
event是原始，原生事件（這樣我就可以調用event.preventDefault()）
arg是一些數據由trigger ER傳遞（原事件的處理程序）
個這兩個事件（本地&定製的）都在相同的元素解僱（所以自定義事件的名稱必須與原來的不同）

我能夠遠遠得到這一點，它的工作原理：

// the native event handler 
function(event) { 
    var e = jQuery.Event("some_custom_event"); 
    e.foo = 'bar'; 
    $(this).trigger(e); 
    if (e.isDefaultPrevented()) 
     event.preventDefault(); 
} 

// an example handler for the custom event: 
function (event) { 
    alert(event.foo); 
    event.preventDefault(); 
}

我想我也可以將原始事件和foo作爲自變量傳遞給自定義事件處理程序，但我想要一個看起來很標準的處理程序（沒有function(event1,event2）。

可以在jQuery中輕鬆地完成任務嗎？

來源

2012-03-20 ori

trigger函數有兩種口味，我認爲你應該看看第一句是.trigger(eventType [, extraParameters])。

如果我理解正確，那麼你需要做的就是你傳遞foo額外PARAM像下面，

$(this).trigger(e, [foo]);

從jQuery的文檔下面是一個例子，

$("p").click(function (event, a, b) { 
// when a normal click fires, a and b are undefined 
// for a trigger like below a refers to "foo" and b refers to "bar" 

}).trigger("click", ["foo", "bar"]);

從技術文檔.. read more..

.trigger（eventType [ ，extraParameters]）

eventType包含JavaScript事件類型的字符串，例如click或提交。

extraParameters傳遞給事件處理程序的其他參數。

來源

2012-03-20 18:23:59

您的解決方案不允許我在自定義事件處理程序中的原始事件上設置「preventDefault」。 – ori 2012-03-20 18:37:24

@ori您能否詳細說明'preventDefault'應該發生什麼？它在第一個地方工作嗎？我確定添加添加參數不會影響以前工作的任何內容。 – 2012-03-20 18:41:45

首先，我在上面的代碼中犯了一個錯誤，看看。我正在構建一個我希望能夠與之交互的jQuery插件。也許某種回調更適合。基本上我想要一個可以引用原始事件的自定義事件處理函數（可以調用'preventDefault'），但是如果我執行'.trigger（'custom'，[event，foo]）'，那麼處理函數變成'function c_event，n_event，foo）{}'看起來很醜。 – ori 2012-03-20 19:07:00

您可以創建一個jQuery事件（$.Event），這將允許event.preventDefault()並兌現或者拿起該事件被觸發後。

所以，先在你的插件/功能的事件，觸發它：

var event = $.Event('myCustomEvent'); 
$element.triggerHandler(event, [extraData1, extraData2]);

在你的處理器

然後，您可以訪問你的和而額外的preventDefault;

$('#someElement').on('myCustomEvent', function (event, extraData1, extraData2) { 
    event.preventDefault(); 
};

現在你可以檢查原始觸發器後看到的默認是被阻止的;

var event = $.Event('myCustomEvent'); 
$element.triggerHandler(event, [extraData1, extraData2]); 

if (event.isDefaultPrevented()) { 
    /* Do something as user prevented default */ 
} else { 
    /* Proceed as normal */ 
};

來源

2013-07-14 13:07:39

這是一個合理的解決方案，謝謝 – Rob 2015-03-20 12:20:24

如何觸發jQuery的自定義事件，傳遞原始事件和數據

回答

相關問題