您可以綁定到的事件的完整列表

JavaScript結合jQuery，可以捕捉許多鼠標事件、鍵盤事件、瀏覽器事件和DOM元素事件，並利用bind()、live()等方法執行基於事件觸發的操作。以下列出了您應該了解的主要事件：blur、focus、focusin、focusout、load、resize、scroll、unload、click、dblclick、mousedown、mouseup、mousemove、mouseover、mouseout、mouseenter、mouseleave、change、select、submit、keydown、keypress、keyup、error

鼠標事件

scroll、click、dblclick、mousedown、mouseup、mousemove、mouseover、mouseout、mouseenter、mouseleave、load、resize、scroll、unload、error

示例：

(function($) {
    $(document).ready(function() {
        $('#id').bind('click', function(e) {
            // 鼠标事件触发（元素被点击）
        });
    });
})(jQuery);

鍵盤事件

keydown、keypress、keyup

示例：

(function($) {
    $(document).ready(function() {
        $(document).bind('keypress', function(e) {
            // 键盘事件触发
        });
    });
})(jQuery);

瀏覽器事件

load、resize、scroll、unload、error

示例：

(function($) {
    $(document).ready(function() {
        // 浏览器事件触发（文档对象模型加载完成）
    });
})(jQuery);

DOM元素事件

blur、focus、focusin、focusout、change、select、submit

示例：

(function($) {
    $(document).ready(function() {
        $('#id').bind('blur', function(e) {
            // DOM事件触发（输入焦点离开）
        });
    });
})(jQuery);

演示

請參考：查找鍵盤按鍵的鍵碼

jQuery事件綁定列表常見問題解答 (FAQs)

jQuery中.bind()和.on()有什麼區別？

jQuery中的.bind()和.on()方法都用於將事件附加到元素。但是，兩者之間有一些關鍵區別。 .bind()方法是jQuery最初提供的附加事件的方法。它不適用於頁面加載後動態添加的元素。另一方面，在jQuery 1.7中引入的.on()方法，既適用於現有元素，也適用於以後動態添加的元素。現在建議在新代碼中使用.on()，因為它具有更好的性能和更多功能。

如何在jQuery中取消綁定事件？

要在jQuery中取消綁定事件，可以使用.unbind()方法。此方法刪除使用.bind()方法附加的事件處理程序。您可以刪除元素的所有事件處理程序，或者通過將事件類型指定為參數來僅刪除特定事件處理程序。例如，$("#element").unbind("click")將刪除id為“element”的元素的所有click事件處理程序。

我可以在jQuery中將多個事件綁定到同一個元素嗎？

是的，您可以在jQuery中將多個事件綁定到同一個元素。您可以通過將對像傳遞給.on()方法來實現此目的，其中鍵是事件名稱，值是事件處理程序。例如，$("#element").on({click: function(){}, mouseover: function(){}})將click和mouseover事件都綁定到id為“element”的元素。

如何在jQuery中停止事件傳播？

要在jQuery中停止事件傳播，可以使用.stopPropagation()方法。此方法阻止事件在DOM樹中冒泡，防止任何父處理程序收到事件通知。您可以在事件處理程序中調用此方法，如下所示：function(event){ event.stopPropagation(); }。

什麼是jQuery中的事件委託，我該如何使用它？

jQuery中的事件委託是一種技術，您可以將事件處理委託給父元素，而不是將事件綁定到特定元素。當您有很多元素或動態添加元素時，這尤其有用。您可以使用.on()方法通過指定選擇器作為第二個參數來使用事件委託。例如，$("#parent").on("click", ".child", function(){})將所有子元素的click事件委託給父元素。

如何在jQuery中以編程方式觸發事件？

要在jQuery中以編程方式觸發事件，可以使用.trigger()方法。此方法觸發選定元素上的指定事件和事件的默認行為（如表單提交）。例如，$("#element").trigger("click")將以編程方式觸發id為“element”的元素上的click事件。

我可以在jQuery中將數據傳遞給事件處理程序嗎？

是的，您可以在jQuery中將數據傳遞給事件處理程序。您可以通過將對像作為第二個參數傳遞給.on()方法來實現此目的。此對象的屬性將在事件處理程序內的事件對像中作為屬性可用。例如，$("#element").on("click", {name: "John"}, function(event){ alert(event.data.name); })將在元素被點擊時顯示“John”。

jQuery中.live()和.on()有什麼區別？

jQuery中的.live()和.on()方法都用於將事件附加到元素。但是，在jQuery 1.7中已棄用的.live()方法有一些限制和特性。它不適用於某些事件（如“submit”和“focus”），並且它將事件處理程序附加到文檔根目錄，這可能會導致性能問題。另一方面，.on()方法克服了這些限制，現在是推薦使用的方法。

如何在jQuery中阻止事件的默認操作？

要在jQuery中阻止事件的默認操作，可以使用.preventDefault()方法。如果事件是可取消的，此方法將取消該事件，這意味著屬於該事件的默認操作將不會發生。您可以在事件處理程序中調用此方法，如下所示：function(event){ event.preventDefault(); }。

我可以在jQuery中只綁定一次事件到元素嗎？

是的，您可以在jQuery中只綁定一次事件到元素。您可以使用.one()方法來實現此目的。此方法的工作方式與.on()方法相同，但在事件處理程序觸發一次後，該事件處理程序將被刪除。例如，$("#element").one("click", function(){})將僅為id為“element”的元素觸發一次click事件處理程序。

以上是您可以綁定到的事件的完整列表的詳細內容。更多資訊請關注PHP中文網其他相關文章！