欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

jquery 事件处理handler函数的参数

程序员文章站 2022-07-08 16:24:30
...
jquery 事件处理handler函数的参数


jquery的bind函数说明

在如下的函数中,我们在处理jquery里经常使用:
$( "#foo" ).bind( "click", function() {
  alert( $( this ).text() );
});


click的handler处理函数一般为function(){},不传参数。那么,这个函数可以接收参数么,内置了什么对象,有什么返回值,怎么获得事件绑定的对象?

1、第一个参数event对象,在function函数里,实际上第一个参数是event
引用
The handler callback function can also take parameters. When the function is called, the event object will be passed to the first parameter.


2、事件参数event.data
给handler传递自己需要传入事件处理函数的参数

引用


var message = "Spoon!";
$( "#foo" ).bind( "click", {
  msg: message
}, function( event ) {
  alert( event.data.msg );
});
message = "Not in the face!";
$( "#bar" ).bind( "click", {
  msg: message
}, function( event ) {
  alert( event.data.msg );
});


3、获得事件绑定的DOM元素,
handler的this指向当前事件绑定的元素,大多数情况下,我们需要拿到该DOM元素,以便取值
或改变展示状态,这时该handler函数的this就是该dom元素。
如果不知道,我们一直在用event.target来取当取事件帮定的元素,实际经常取错,因为触发
该事件的event.target可能是实际绑定元素的内部元素,如

<div><p>点击一下</p></div>

如上所示,绑定事件到DIV上,实际P标签也能触发事件,这时event.target对象就不是原来绑定
事件的元素。
偶然发现的this指向绑定的dom原素,不得不佩服john,想得很充分,功能洽到好处。

4、事件传播和返回值
只要返回false,就代表.preventDefault()和.stopPropagation();停止事件传播。
无需再手动调用这再两个函数。
引用

Returning false from a handler is equivalent to calling both .preventDefault() and .stopPropagation() on the event object.


引用

JavaScript领域的神级人物,jQuery、《Pro JavaScript》与《JavaScript Secrets》的作者, Khan Academy计算机科学学院的院长John Resig,John Resig开发jQuery的时候还是大二的学生。

john resig 的对话

现在市面上有大量的JavaScript框架,在各自的官网上都号称是不可被击败的框架,JQuery跟他们相比,真正的优势和特点在哪,大家为什么选择用JQuery呢?
  John Resig认为JQuery最大的优势在于完全关注于DOM,都是找到对象然后控制,在提供这些功能的时候文件大小非常小。比如说现在浏览器提供了各种各样硬件加速,随着浏览器变得越来越好,JS的性能也越来越好。
  有与会者问到:jQuery的开发团队情况?
  John Resig透露:有20多个人。jQuery Core的代码提交者有3个人。大家主要使用Git、github进行合作。
  现场有同学还提了一个有趣的问题,John Resig会不会写起代码来忘我工作,会不会听摇滚乐。Resig回答,会工作到很晚,更喜欢听爵士乐。此外,不少与会者还就很多jQuery开发过程中实践情况与John Resig展开了沟通(付江)

John Resig

jquery 事件处理handler函数的参数
            
    
    博客分类: JavaScript jquery 


  • jquery 事件处理handler函数的参数
            
    
    博客分类: JavaScript jquery 
  • 大小: 26.6 KB
相关标签: jquery