jQuery trigger（）方法：如何在jQuery中創建自定義事件

態在我上一篇文章中，如何在JavaScript中創建自定義事件 ，我們討論了自定義事件的好處和本地的託管對象。回顧一下，我們可以解僱自己的命名活動。每當提交有效的消息時，DemonStation頁面提供了一個表格，該表格發出了“ newmessage”事件。任何數量的處理人員都可以訂閱此事件以執行自己的操作。 我們唯一的問題：目前在Safari或Internet Explorer中不支持Customevent。 瀏覽器兼容性問題有很多方法。一種解決方案是編寫您自己的事件封裝功能，以實現自定義事件功能。幸運的是，沒有必要：在包括jQuery在內的幾個JavaScript庫中支持自定義活動。 jQuery的.Trigger方法是關鍵。您可以在任何時候都使用新的類型名稱和任意數據觸發事件，例如

$.event.trigger({
	type: "newMessage",
	message: "Hello World!",
	time: new Date()
});

管理人員現在可以訂閱“新雜誌”事件，例如

$(document).on("newMessage", newMessageHandler);

>演示頁

此示例演示了jQuery代碼： 查看jQuery自定義事件演示頁面 標準事件處理程序在HTML表單上尋找提交。該函數獲取當前消息，並假設其有效，則會派遣一個新的“新雜誌”事件。

$("#msgbox").on("submit", SendMessage);

// new message: raise newMessage event
function SendMessage(e) {

	e.preventDefault();
	var msg = $("#msg").val().trim();
	if (msg) {
		$.event.trigger({
			type: "newMessage",
			message: msg,
			time: new Date()
		});
	}

}

管理人員現在可以訂閱“新雜誌”事件。事件僅在有有效的消息時才提出：

// newMessage event subscribers
$(document).on("newMessage", newMessageHandler);

// newMessage event handler
function newMessageHandler(e) {
	LogEvent(
		"Event subscriber on "+e.currentTarget.nodeName+", "
		+e.time.toLocaleString()+": "+e.message
	);
}

可以從事件對象的消息屬性中提取消息本身。

>瀏覽器兼容性

jQuery 1.x方法在任何瀏覽器中運行，包括Internet Explorer 6.0及以上。顯然，即使代碼比本地的Customevents慢（毫無意義）的代碼運行（毫無意義）也是一個巨大的好處。但是，請注意，計劃於2013年發布的JQuery 2.0將不支持IE6、7和8。 JQuery很受歡迎，但是在包括原型，Mootools和Yui在內的大多數JavaScript庫中都支持自定義活動 。 >如果您喜歡閱讀這篇文章，您會喜歡學習的；從大師那裡學習新鮮技能和技術的地方。成員可以立即訪問SitePoint的所有電子書和交互式在線課程，例如JQuery：Nevice to Ninja：New Kicks and Tricks。 >對本文的評論已關閉。有關於jQuery的問題嗎？為什麼不在我們的論壇上詢問？ 經常詢問有關jQuery自定義事件的問題（常見問題解答） >什麼是jQuery自定義事件，為什麼它們很重要？

jQuery自定義事件是用戶定義的事件，除了JQuery提供的標準事件外，開發人員還可以創建和管理自己的事件。它們很重要，因為它們提供了一種封裝行為的方法，該行為可以在應用程序的不同部分重複使用。這可以通過減少重複和促進關注點的分離來導致更清潔，更可維護的代碼。

>如何在jQuery中創建自定義事件？您可以使用.trigger（）方法觸發自定義事件。這是一個簡單的示例：

$（document）.trigger（'mycustomevent'）;
$（document）.trigger（'mycustomevent'，{key：'value'}）;
在此示例中，對象{key：'value' } is傳遞給事件處理程序。

如何處理jQuery中的自定義事件？

您可以使用.on（）使用.on（）來處理jQuery中的自定義事件 方法。這是一個示例：

$（document）.on（'mycustomevent'，function（event，data）{
console.log（data.key）; //'value'value'
}） ;在此示例中，在此示例中，提供給.on（）方法的功能是事件處理程序。

>我可以阻止自定義事件傳播是的，您可以通過在事件對像上調用.stoppropagation（）方法來阻止自定義事件在jQuery中傳播。這是一個示例：

$（document）.on（'mycustomevent'，function（event）{

event.stoppropagation（）;
}）;


，stoppropagation（）方法可防止事件冒泡。是的，您可以通過在事件對像上調用.preventDefault（）方法來防止jQuery中自定義事件的默認操作。這是一個示例：

$（document）.on（'mycustomevent'，function（event）{

event.preventdefault（）;

}） ，destrest -deffault（）方法可防止與事件關聯的默認操作。

我只能在jquery中觸發一次自定義事件？
>是的，您可以使用.One（）方法而不是.on（）方法在jQuery中僅觸發一次自定義事件。這是一個示例：

$（document）.One（'mycustomevent'，function（）{console.log（'this只能記錄一次。'）;
}）;

我可以刪除自定義事件在jQuery中使用的處理程序？這是一個示例：

$（document）.off（'mycustomevent'）;

>

在此示例中，刪除了文檔上'mycustomevent'的所有處理程序。我可以在jQuery中手動觸發自定義事件嗎？以下是一個示例：

$（document）.trigger（'mycustomevent'）;
在此示例中，'mycustomevent'被手動觸發。
>

>我可以將多個處理程序綁定到jQuery中的自定義事件嗎？這是一個示例：

$（document）.on（'mycustomevent'，function（）{console.log（'handler 1'）;
}） $（document）。 2'）;
}）;

在此示例中，當觸發“ mycustomevent'”時，將調用兩個處理程序。
>

以上是jQuery trigger（）方法：如何在jQuery中創建自定義事件的詳細內容。更多資訊請關注PHP中文網其他相關文章！