jquery绑定事件的方法
来源:互联网 发布:算法精解源码 编辑:程序博客网 时间:2024/05/16 09:47
jquery绑定事件的方法
jquery绑定事件的方法(四种):分别是bind、live、delegate、on,对应的解除监听的函数分别是unbind、die、undelegate、off
一、on()方法(首选)
on()方法在被选元素及子元素上添加一个或多个事件处理程序
参数:
event:必需,规定要从被选元素移除的一个或多个事件或命名空间。由空格分隔多个事件值。必须是有效的事件。data:可选。规定只能添加到指定的子元素上的事件处理程序(且不是选择器本身,比如已废弃的 delegate() 方法)。function:可选。规定当事件发生时运行的函数。map:规定事件映射 ({event:function, event:function, ...}),包含要添加到元素的一个或多个事件,以及当事件发生时运行的函数。eg: $(selector).on(event,childSelector,data,function,map)
//给P元素添加单击事件<body><p>点我一下</p><script src="jquery-1.10.1.min.js"></script><script> $("p").on("click",function(){ alert("The paragraph was clicked"); });</script></body>
优点:on()可以绑定动态添加到页面元素的事件,不用关心注册该事件的元素何时被添加进来,也不需要重复绑定。
on()绑定事件可以提升效率,
例子:多个事件绑定同一个函数
<script> $(document).ready(function(){ $("p").on("mouseover mouseout",function(){ $("p").toggleClass("intro"); }); });
二、bind()方法
bind()方法:作用是在选择到的元素上绑定特定事件类型的监听函数
参数:
type:必需。事件类型,如click、change、mouseover等;
data:可选。传入监听函数的参数,通过event.data取到。可选;
function:必需。规定当事件发生时运行的函数(监听函数),可传入event对象,这里的event是jQuery封装的event对象,与原生的event对象有区别,使用时需要注意。
map:规定事件映射 ({event:function, event:function, …}),包含要添加到元素的一个或多个事件,以及当事件发生时运行的函数
语法:$(selector).bind(event,data,function,map)
举例:
<body><p>点我一下</p><script src="jquery-1.10.1.min.js"></script><script> $("p").bind("click",function(){ alert("单击P元素"); });</script></body>
三、delegate()方法
delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。
参数:
childSelector:必需。规定要添加事件处理程序的一个或多个子元素。
event:必需。规定添加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。
data:可选。传递到该函数的额外参数
function:必需。当事件发生时,运行的函数
语法:$(selector).delegate(childSelector,event,data,function)
举例:当单击 div元素内部的 p元素时,改变所有 p元素的背景颜色:
<body><div> <p>点我啊</p> <p>随便 </p> <p>看看</p></div><script src="jquery-1.10.1.min.js"></script><script> $("div").delegate("p","click",function(){ $("p").css("background-color","pink"); });</script></body>
- JQuery绑定事件的方法
- jquery绑定事件的方法
- Jquery事件绑定方法
- jquery下onpropertychange事件的绑定方法
- 完美的jquery事件绑定方法on()
- jquery的几个元素绑定事件方法
- jQuery的on方法绑定事件
- JQuery绑定事件的四种方法
- jQuery新的事件绑定方法on()
- jquery中几种事件绑定的方法比较
- jQuery的绑定事件
- jQuery的事件绑定
- jquery的绑定事件
- jquery的事件绑定
- JQuery事件的绑定
- jQuery的事件绑定
- JQuery事件绑定live方法
- jquery live()方法绑定事件
- 表格
- Paint 的 Xfermode 的用法
- Spring事务传播机制与隔离级别
- tensorlfow 复制与拼接
- Maven工程中jetty插件运行web应用时静态资源文件修改不能实时生效的问题
- jquery绑定事件的方法
- node全文检索研究
- html5中新添加的元素与移除的元素
- AnyCasting.2.4[铸造模拟软件最新+天喻CAD2005完美
- json格式对象和数组的不同处理方法
- ListView里如果有EditText,Edittext的值修改后,会触发其他的item里EditText的addTextChangedListener,导致数据重复
- Hbase的应用场景、原理及架构分析
- Python:归并排序算法
- c++虚函数的内存模型