jQuery学习之bind

jQuery学习之bind

在jQuery里面,直接用bind函数和unbind函数为某个DOM或者HTML标签等绑定一个操作和移除一个事件就行了。

例如为一个button添加一个click。可以这样操作 

XML/HTML代码
  1. <input type='button' id='myBtn'>   

 这是一个button,现在我们要为他添加一个事件 

JavaScript代码
  1. <script>       
  2. $('#myBtn').bind("click",function(){       
  3.     alert('click');       
  4. });       
  5. </script>     

这样,我们就为这个button绑定了一个click的事件。

bind函数可以有三个参数,当第二个参数不是一个函数,而是一个数据对象时,它将默认做为bind第三个参数(函数)的参数。例如:

JavaScript代码
  1. <script>      
  2. function showAlert(events){       
  3.     alert(events.data.foo);       
  4. }       
  5. $('#myBtn').bind('click',{foo:'click'},showAlert);       
  6. </script>     

点击时,同样会显示:click

这些就是bind的一些基本用法,当然还有一些方法

比如在绑定方法的时候,用的是return false;可以让这个方法失效

JavaScript代码
  1. <script>       
  2. $('#myBtn').bind('click',function(){       
  3. return false;       
  4. })       
  5. </script>     

这样,刚才绑定的click又失效了,不过,这种方法往往用在submit提交的时候比较多。

还有一些方法可以取消默认行为和阻止事件起泡:preventDefault 和stopPropagation

例:

JavaScript代码
  1. <script>   
  2. $('#myBtn').bind('click',function(event){   
  3. event.preventDefault();//取消默认的click行为   
  4. });   
  5. $('#myBtn').bind('click',function(event){   
  6. event.stopPropagation();//阻止click事件起泡   
  7. });   
  8.   
  9. </script>  
原文地址:https://www.cnblogs.com/rooney/p/1347583.html