1K+ 次浏览
jQuery 的 setTimeout() 方法用于设置事件触发的间隔。示例这里,我们将使用 jQuery 事件设置 3 秒的间隔来加载警告框:在线演示 $(document).ready(function(){ $("#button1").click(function(){ setTimeout("alert('Hello World!');", 3000); }); }); 点击 点击上面的按钮并等待 3 秒。3 秒后将生成一个警告框。
2K+ 次浏览
要使用 jQuery 检测图像的加载,请使用 load() 事件处理程序。注意:load() 方法在 jQuery 1.8 版本中已弃用。它在 3.0 版本中被完全移除。要查看其工作原理,请在 3.0 之前的版本中添加 jQuery CDN 版本。示例您可以尝试运行以下代码来学习如何检测图像何时加载:在线演示 $(document).ready(function(){ $("img").load(function(){ alert("图像已成功加载。"); }); }); 注意:load() 方法在 jQuery 1.8 版本中已弃用。它在 3.0 版本中被完全移除。要查看其工作原理,请在 3.0 之前的版本中添加 jQuery CDN 版本。
199 次浏览
要检查 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("new item ×"); }); $(document).on("click", "a.del" , function() { $(this).parent().remove(); }); }); 添加 点击上面的按钮动态添加新的列表项。您可以稍后将其删除。 项
221 次浏览
假设事件处理程序已附加到您的元素。例如,$('#foo').click(function() { console.log('clicked!') });然后您可以像这样调试它:对于 jQuery 1.3.xvar cEvent = $('#foo').data("events").click; jQuery.each(cEvent, function(key, value) { console.log(value) }) 对于 jQuery 1.4.xvar cEvent = $('#foo').data("events").click; jQuery.each(cEvent, function(key, handlerObj) { console.log(handlerObj.handler) }) 对于 jQuery 1.8.x+var cEvents = $._data($('#foo')[0], "events").click; jQuery.each(cEvents, function(key, handlerObj) { console.log(handlerObj.handler) })
929 次浏览
jQuery load() 方法load() 方法用于将事件处理程序附加到加载事件。示例您可以尝试运行以下代码来学习如何使用 jQuery load() 方法。注意:该方法在 jQuery 1.8 中已弃用。它最终在 jQuery 3.0 中被移除。要运行以下代码,请添加小于 1.8 的 jQuery 版本,在线演示 $(document).ready(function(){ $("img").load(function(){ alert("这是一张图片。"); }); }); 这张图片只会在 jQuery 版本小于 1.8 时加载 jQuery ready() 方法轻松指定... 阅读更多
4K+ 次浏览
要使用多个事件触发同一个函数,请使用 jQuery on() 方法和多个事件,例如 click、dblclick、mouseenter、mouseleave、hover 等。示例您可以尝试运行以下代码来学习如何使用 jQuery 多个事件使用同一个函数:在线演示 $(document).ready(function(){ $("p").on({ mouseenter: function(){ $(this).css("background-color", "gray"); }, mouseleave: function(){ $(this).css("background-color", "red"); }, dblclick: function(){ $(this).css("background-color", "yellow"); } }); }); 点击、双击并移动鼠标指针。
569 次浏览
从 jQuery 事件处理程序返回 false 就如同同时调用 preventDefault() 和 stopPropagation()。preventDefault() 方法阻止浏览器执行默认操作。示例您可以尝试运行以下代码来运行 jQuery 中的 event.preventDefault() 方法 −在线演示 jQuery preventDefault() 方法 $(document).ready(function() { $("a").click(function(event){ event.preventDefault(); alert( "默认行为已禁用!" ); }); ... 阅读更多
691 次浏览
要检查按下了哪个键,请使用 onkeydown 属性。示例您可以尝试运行以下代码来获取按下的键:在线演示 在下面的框中按下一个键以获取按下的键。 function demoFunction(event) { var a = event.key; document.getElementById("test").innerHTML = "您按下了键: " + a; }
要阻止 jQuery 事件冒泡到父元素,请使用 stopPropogation() 方法。stopPropagation() 方法停止事件向父元素冒泡,防止任何父处理程序收到事件通知。示例您可以尝试运行以下代码来阻止 jQuery 事件冒泡到父元素 −在线演示 jQuery stopProagation() 方法 $(document).ready(function() { $("div").click(function(event){ alert("这是: " + $(this).text()); event.stopPropagation(); }); }); div { margin:20px; padding:20px; border:2px solid #666; width:160px; } 点击任何框以查看效果: 外部框 内部框