jQuery – 8.事件和事件参数
事件
(*)JQuery中的事件绑定：$(“#btn”).bind(“click”,function(){})，每次都这么调用太麻烦，所以jQuery可以用$(“#btn”).click(function(){})来进行简化。unbind
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 | <!DOCTYPE html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script src="Jqeury/jquery-1.10.2.js"></script> <script type="text/javascript"> $(function () { $("input[value='bind']").click(function() { $("#btn").bind( { "click": function() { alert("click"); }, "mouseover": function() { alert("mouseover"); }, "mouseout": function() { alert("mouseout"); } } ); }); $("input[value='unbind']").click(function () { //移除事件 //$("#btn").unbind("mouseout"); //移除所有事件 $("#btn").unbind(); }) }) </script></head><body> <input id="btn" type="button" value="test"> <input type="button" value="bind"> <input type="button" value="unbind"> <input type="button" value="one" /></body></html> |
一次性事件：如果绑定的事件只想执行一次随后立即unbind可以使用one()方法进行事件绑定
//一次性事件
$("input[value='one']").click(function () {
$("#btn").one("click", function() {
alert("click");
});
})
(*)合成事件 hover ，hover(enterfn (焦点),leavefn (离开焦点))，当鼠标放在元素上时调用enterfn方法，当鼠标离开元素的时候调用leavefn方法。 （toggle() ：jquery.1.9删除了切换功能）
mouseover、mouseenter的区别：div里套div。见备注。和事件冒泡有关系。
事件冒泡：JQuery中也像JavaScript一样是事件冒泡
如果想获得事件相关的信息，只要给响应的匿名函数增加一个参数：e，e就是事件对象。调用事件对象的stopPropagation()方法终止冒泡。e. stopPropagation();
$("tr").click(function(e) { alert("tr被点击"); e.stopPropagation(); });//注意函数的参数是e
阻止默认行为：有的元素有默认行为，比如超链接点击后会转向新链接、提交按钮默认会提交表单，如果想阻止默认行为只要调用事件对象的preventDefault()方法和Dom中的window.event.returnValue=false效果一样。
$("a").click(function(e) { alert("所有超链接暂时全部禁止点击"); e.preventDefault(); });
作者：【唐】三三
出处：https://www.cnblogs.com/tangge/p/3205445.html
版权：本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。
分类:
Web - jQuery
标签:
jQuery
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· SQL Server 2025 AI相关能力初探
· Linux系列：如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列（二）：开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 阿里最新开源QwQ-32B，效果媲美deepseek-r1满血版，部署成本又又又降低了！
· Manus重磅发布：全球首款通用AI代理技术深度解析与实战指南
· 开源Multi-agent AI智能体框架aevatar.ai，欢迎大家贡献代码
· 被坑几百块钱后，我竟然真的恢复了删除的微信聊天记录！
· AI技术革命，工作效率10个最佳AI工具