【jQuery使用手册】七：事件

时间：2010-09-01 来源：Tony_Zhang

　　　　七：事件

　　　　ready(fn)　　　　返回值：jQuery

　　　　当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。这是事件模块中最重要的一个函数。因为它可以极大地提高web应用程序的相应速度。简单的说，这个方法纯粹是对向window.load事件注册事件的替代方法。通过使用这个方法，可以在DOM载入就绪能够读取并操纵时立即调用所绑定的函数，而大部分的JavaScript函数都需要在那一刻执行。请确保在元素的onload事件中没有注册函数，否则不会触发$(document).ready()事件。可以在同一个页面中无限次地使用$(document).ready()事件，其中注册的函数会按照代码中的先后顺序依次执行。示例：要在DOM就绪时执行的函数。

1 jQuery代码；
2         $(document).ready(function(){
3         //在这里写需要的代码。。。
4         });

　　　　　示例：使用$(document).ready()的简写，同时内部的jQuery代码依然使用$作为别名，而不管全局的$为何。

1 jQuery代码：
2         jQuery(function(){
3        //可以在这里继续使用$作为别名。。。
4        });

　　　　bind(type,[data],fn)　　　　返回值：jQuery

　　　　为每个匹配元素的特定事件绑定事件处理函数。.bind()方法是用于往文档上附加行为的主要方式。所有JavaScript事件对象，比如focus，mouseover和resize都是可以作为type参数为type参数传递进来的。jQuery还提供了一些绑定这些标准事件类型的简单方式，比如.click()用于简化.bind('click')。一共有以下这些：blur,focus,focusin,focusout,resize,scroll,unload,click,dblclick,mousedown,mouseup,mousemove,mouseover,mouseout,mouseenter,mouseleave,change,select,submit,keydown,keypress,keyup,error。

任何作为type参数的字符串都是合法的；如果一个字符串不是原生的JavaScript事件名，那么这个事件处理函数会绑定到一个自定义事件上。这些自定义事件不会由浏览器触发，但可以通过使用.trigger()或者.triggerHandler()在其他代码中手动触发。如果type参数的字符串中包含一个点字符(.)，那么这个事件就看做是有命名空间的了。这个点字符就用来分隔事件和他的命名空间。例如，如果要执行.bind("click.name",handler),那么字符串中的click是事件类型，name就是命名空间。命名空间允许我们取消绑定或者触发一些特定类型的事件，而不用触发别的事件。.bind()最基本的用法是：

1 jQuery代码：
2        $('#foo').bind('click',function(){
3            alert('User clicked on "foo".');
4        });

可以依次绑定多个事件类型，每个事件类型用空格分隔。在jQuery1.4中，可以通过传入一个映射来对一次绑定多个事件处理函数。示例：当每个段落被点击的时候弹出其文本。

1         $("p").bind("click",function(){
2             alert($(this).text());
3         });

示例：在事件处理之前传递一些附加的数据。

1 jQuery代码：
2         function handler(event){
3            alert(event.data.foo);
4        }
5        $("p").bind("click",{foo:"bar"},handler);

示例：通过返回false来取消默认的行为并阻止事件起泡。

1 jQuery代码：
2 $("form").bind("submit",function(){return false;});

示例：通过使用preventDefault()方法只取消默认的行为。

1 jQuery代码：
2         $("form").bind("submit",function(event){
3          event.preventDefault();
4         });

示例：通过使用stopPropagation()方法只阻止一个事件起泡。

1 jQuery代码：
2         $("form").bind("submit",function(event){
3            event.stopPropagation();
4        });