使用 off() 方法覆盖 jQuery 事件处理程序。此方法用于移除事件处理程序。on() 方法用于附加一个或多个事件处理程序。示例您可以尝试运行以下代码以了解如何覆盖 jQuery 事件处理程序 -在线演示 jQuery off() 方法 $(document).ready(function() { function aClick() { $("div").show().fadeOut("slow"); } $("#bind").click(function () { $("#theone").on("click", aClick).text("可以点击！"); }); $("#unbind").click(function () { $("#theone").off("click", aClick).text("无操作..."); }); }); button { margin:5px; } button#theone { color:red; background:yellow; } 无操作... 绑定点击 取消绑定点击 点击！

自定义事件意味着您可以在 jQuery 中创建自己的事件。例如，创建一个自定义事件，在按下键盘上的任意键时触发一个警报框。示例您可以尝试运行以下代码以了解如何创建自定义事件，在线演示 $(document).ready(function(){ $('textarea').bind("enterKey",function(e){ alert("您按下了 Enter 键！"); }); $('textarea').keyup(function(e){ if(e.keyCode == 13) { $(this).trigger("enterKey"); } }); });

要存储和重现 jQuery 事件，请使用控制台记录。示例您可以尝试运行以下代码以了解如何存储和重现 jQuery 事件：在线演示 $(document).ready(function(){ window.events = [] $("#track").click(function(event){ window.events.push(event) $.each(window.events, function(i, item){ console.log(i, item); }); }); }); 跟踪

某些 jQuery 事件不会冒泡，例如 mouseenter 不会冒泡。让我们看一个此类事件的示例。示例您可以尝试运行以下代码以了解如何使用不会冒泡的 jQuery 事件，在线演示 $(document).ready(function(){ $("p").mouseenter(function(){ $("p").css("background-color", "red"); }); $("p").mouseleave(function(){ $("p").css("background-color", "blue"); }); }); 演示文本 - 将鼠标指针保持在此处。

stopPropogation() 方法要停止事件向父元素冒泡，请使用 stopPropagation() 方法。示例您可以尝试运行以下代码以了解如何使用 stopPropogation() 方法：在线演示 jQuery stopPropagation() 方法 $(document).ready(function() { $("div").click(function(event){ alert("这是： " + $(this).text()); event.stopPropagation(); }); ... 阅读更多

要优先处理 jQuery 事件，请使用 event.stopPropagation()。示例您可以尝试运行以下代码以了解如何使用 stopPropogation() 方法进行优先处理：在线演示 $(document).ready(function(){ var timer; function out(s) { if (timer) { clearTimeout(timer); timer = null; } $("#demo").append(s + ""); timer = setTimeout(function() { $("#demo").append("-------" + ""); timer = null; }, 100); } $(".li").find('input').click(function(e){ out('li>input'); if ($(this).parent().hasClass("stop")) { e.stopPropagation(); } }); $(".li").click(function(e){ out('li'); }); $('input').click(function(e){ out('input'); if ($(this).parent().hasClass("stop")) { e.stopPropagation(); } }); }); 演示 使用停止传播方法的演示

jQuery setTimeout() 方法用于设置事件触发的间隔。示例这里，我们将设置一个 3 秒的间隔，以便使用 jQuery 事件加载警报框：在线演示 $(document).ready(function(){ $("#button1").click(function(){ setTimeout("alert('Hello World!');", 3000); }); }); 点击 点击上面的按钮并等待 3 秒。3 秒后将生成一个警报框。

要使用 jQuery 检测图像的加载，请使用 load() 事件处理程序。注意：load() 方法在 jQuery 1.8 版中已弃用。它在 3.0 版中被完全移除。要查看其工作原理，请在 3.0 之前添加 CDN 的 jQuery 版本。示例您可以尝试运行以下代码以了解如何检测图像何时加载：在线演示 $(document).ready(function(){ $("img").load(function(){ alert("图像已成功加载。"); }); }); 注意：load() 方法在 jQuery 1.8 版中已弃用。它在 3.0 版中被完全移除。要查看其工作原理，请在 3.0 之前添加 CDN 的 jQuery 版本。

要检查 jQuery 事件是否阻塞，请使用 .triggerHandler() 方法，因为它返回该选择器上该事件的最后一个事件处理程序返回的任何内容。示例在线演示 $(document).ready(function(){ var myValue = "John"; $("body").bind("eventName", function(e, value) { return value + " Jacob"; }); var result = $("body").triggerHandler("eventName", myValue); alert(result); }); 这将显示一个警报框。

要绑定动态创建的元素上的事件，您需要动态加载。您可以尝试运行以下代码以了解如何在动态创建的元素上绑定事件。在这里，我们将点击按钮生成一个新的列表项。示例在线演示 $(document).ready(function(){ $("button").click(function(){ $("ul").append("新项目 ×"); }); $(document).on("click", "a.del" , function() { $(this).parent().remove(); }); }); 添加 点击上面的按钮动态添加新的列表项。您可以稍后将其删除。 项目