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,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· PostgreSQL 和 SQL Server 在统计信息维护中的关键差异
· C++代码改造为UTF-8编码问题的总结
· DeepSeek 解答了困扰我五年的技术问题
· 为什么说在企业级应用开发中,后端往往是效率杀手?
· 用 C# 插值字符串处理器写一个 sscanf
· 为DeepSeek添加本地知识库
· 精选4款基于.NET开源、功能强大的通讯调试工具
· DeepSeek智能编程
· [翻译] 为什么 Tracebit 用 C# 开发
· 腾讯ima接入deepseek-r1,借用别人脑子用用成真了~