jQuery学习之bind
在mootools里面,如果要为某个DOM或者HTML标签等绑定一个操作用的是addEvents,移除一个事件的时候用的是removeEvents,在jQuery里面就相对比较简单,直接用bind函数和unbind函数就行了。
例如为一个button添加一个click。可以这样操作
XML/HTML代码
- <input type='button' id='myBtn'>
这是一个button,现在我们要为他添加一个事件
JavaScript代码
- <script>
- $('#myBtn').bind("click",function(){
- alert('click');
- });
- </script>
这样,我们就为这个button绑定了一个click的事件。
bind函数可以有三个参数,当第二个参数不是一个函数,而是一个数据对象时,它将默认做为bind第三个参数(函数)的参数。例如:
XML/HTML代码
- <script>
- function showAlert(events){
- alert(events.data.foo);
- }
- $('#myBtn').bind('click',{foo:'click'},showAlert);
- </script>
点击时,同样会显示:click
这些就是bind的一些基本用法,当然还有一些方法
比如在绑定方法的时候,用的是return false;可以让这个方法失效
JavaScript代码
- <script>
- $('#myBtn').bind('click',function(){
- return false;
- })
- </script>
这样,刚才绑定的click又失效了,不过,这种方法往往用在submit提交的时候比较多。
还有一些方法可以取消默认行为和阻止事件起泡:preventDefault 和stopPropagation
例:
JavaScript代码
- <script>
- $('#myBtn').bind('click',function(event){
- event.preventDefault();//取消默认的click行为
- });
- $('#myBtn').bind('click',function(event){
- event.stopPropagation();//阻止click事件起泡
- });
- </script>