jquery 事件处理handler函数的参数
jquery的bind函数说明
在如下的函数中,我们在处理jquery里经常使用:
click的handler处理函数一般为function(){},不传参数。那么,这个函数可以接收参数么,内置了什么对象,有什么返回值,怎么获得事件绑定的对象?
1、第一个参数event对象,在function函数里,实际上第一个参数是event
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标签也能触发事件,这时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的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
发表评论
-
解决eclipse在修改js卡顿现象
2018-02-09 15:49 1360新版eclipse编辑含有javascript内容的jsp时, ... -
chosen 数据的动态更新
2016-09-08 15:28 1766chosen是个不错的复合下拉组件,缺点是文档较少 源码在gi ... -
优秀的弹层组件
2016-04-20 18:19 659http://layer.layui.com/ -
googleapis.com域名访问慢的解决办法
2016-04-13 12:09 9681、安装火狐 2、安装插件ReplaceGoogleCDN -
国内常用前端公共库CDN服务
2015-11-15 14:00 943BAIDU http://cdn.code.baidu.co ... -
jquery validate 1.14
2015-10-12 20:14 794<!DOCTYPE html PUB ... -
jquery tr rowindex
2014-11-30 13:42 902var tr = $(this).parents('tr' ... -
jqgrid please select row warning
2014-11-23 19:42 1722引入ui.jqgrid.css即可解决 -
改变多个jquery.ready的默认顺序
2014-11-23 15:37 1293$(document).ready 这个函数的解释: 引用 D ... -
javascript 错误的继承方式
2014-11-02 23:02 722var parent = {t:1,m:2,} pare ... -
JS图片格式验证
2014-07-03 16:48 901function pic(file){ var r ... -
更改underscorejs默认的匹配符
2014-06-14 11:51 844/** 修改underscore.js默认的< ... -
uglifyjs批量压缩js
2014-06-13 16:34 2426jquery官方使用uglifyjs进行压缩的,压缩比较高 ... -
html5 canvas作的手写板【兼容手机】
2014-05-21 15:56 5276<!DOCTYPE html> <ht ... -
backbone.js model和view视图的单元测试
2014-05-20 17:32 1359backbone的模块化开发,需要引入测试流程保证代码的质量, ... -
由正则表达式html或xml标签配对说起【括号编组和正负向预查】
2014-05-15 14:17 2472经常会查找xml或HTM ... -
netbeans和karma进行单元测试二【jasmine入门】
2014-05-20 15:43 1689karma配好之后,默认使用的是jasmine作为测试框架: ... -
javascript的代理和切面
2014-05-15 13:39 738Java里有面向切面的实现方式,可以监控包、对象、函数 ... -
backbone.js路由Router的使用
2014-05-09 11:33 1581路由的使用很简单,路由的转向 router.navigate( ... -
backbone.js的View里的事件重复调用
2014-05-09 11:18 1991backbone的一个视图被初始化多次后,发现一个按钮事 ...
相关推荐
本篇文章将深入探讨jQuery中的事件函数,帮助开发者更高效地处理用户交互。 一、事件绑定:`$(selector).on()` 在jQuery中,`on()`方法是最核心的事件绑定函数,它可以绑定多种类型的事件。基本语法为: ```...
jQuery提供了多种方式来绑定事件处理函数,最常用的是`$(selector).on(event, handler)`。例如,`$("#myButton").click(function() {...})`用于监听ID为`myButton`的元素的点击事件。此外,`bind()`、`live()`(已...
事件处理函数可以接收一个事件对象作为参数,这个对象包含了关于事件的详细信息。例如,`event.target`表示触发事件的元素,`event.preventDefault()`可以阻止默认行为,`event.stopPropagation()`则阻止事件冒泡。 ...
如果想解绑特定的事件处理函数,需要提供额外的参数: ```javascript var handler = function() { console.log('事件被触发了'); }; $('#myElement').on('click', handler); // 后来... $('#myElement')....
所以我们要修改一下源文件jquery.easydrag.handler.beta2.js:找到 function(handlerId) 这个函数, 将里面的$(“#”+handlerId)都改成$(“.”+handlerId)就可以了。好吧,这样就可以了,下面是实例,高手们请 ...
随着jQuery库的广泛应用,它提供的事件处理机制简化了事件管理的工作,并且使得事件处理更加高效和便捷。在本文中,我们将深入理解jQuery的事件处理机制,包括事件绑定、命名空间的使用、事件对象的属性、事件处理器...
以上两种方法都是有效的方式,用于在jQuery事件处理中传递动态参数。对于不熟悉这些技术的人来说,这部分知识可能比较难以掌握。但是对于希望深入理解jQuery事件处理机制和提高jQuery使用效率的开发者来说,这些知识...
为了实现更复杂的事件机制,可以利用jQuery的`proxy`方法来改变事件处理函数的上下文(`this`关键字指向的对象)。同时,可以使用`off`方法移除已绑定的事件,以避免内存泄漏。 ```javascript var handler = ...
这里,`selector`是用于选择要绑定事件的元素的jQuery选择器,`event`是想要监听的事件名称(如`click`、`mouseover`等),而`handler`则是当事件发生时要执行的函数。 例如,如果我们想要在点击按钮时显示一条消息...
在jQuery中,事件对象会作为参数传递给事件处理函数,这与DOM标准一致,无需像原生JavaScript那样在IE中通过`window.event`或非标准方式获取。例如,处理点击事件的函数可以这样写: ```javascript $(document).on...
- **`handler`**:可选参数,如果提供了这个参数,则只移除特定的事件处理函数。 如果希望根据命名空间来解除绑定,可以通过以下方式: ```javascript $(selector).unbind('.myCustomRoutine'); ``` 这会解除所有...
然后,将当前的事件处理器(`handler`)添加到`handlers`列表中,并将`handleEvent()`函数绑定到目标元素的事件类型上。这样,当事件触发时,`handleEvent()`函数就会被调用。 `removeEvent()`函数的作用是删除指定...
**jQuery** 是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画和AJAX交互。在处理AJAX请求时,jQuery提供了`$.ajax()`函数,可以方便地发送异步HTTP请求,并处理服务器返回的数据。使用jQuery可以使得...
IE的event在是在全局的window下, 而mozilla的event是事件源参数传入到回调函数中。还有很多的事件处理方式也一样。 Jquery提供了一个 event的包裹,这个相对于其它的lib提供的有点简单,但是足够使用。 代码如下: /...
我当时的处理方法是在添加的时候手工绑定事件处理函数。不过新版的jquery已经添加了这个功能。我们已经不需要为此烦恼了。 参考:http://api.jquery.com/live/ 以前我们定义事件,比如为元素定义单击事件是这样写的...
2. **jQuery的$.getJSON**:在JavaScript中,使用`$.getJSON`来发起一个AJAX请求,其参数通常包括URL(指向ASHX处理程序的路径)、一个回调函数(当数据加载完成时执行)以及可选的设置参数。回调函数接收三个参数,...
jQuery事件处理如`$(element).on('event', handler)`,允许在指定元素上绑定事件处理器。`off()`用来取消事件绑定。 **jQuery工具方法** jQuery还提供了一系列工具方法,如`$.each()`, `$.trim()`, `$.grep()`, `$...
语法结构为`$(selector).on(event, handler)`, 其中`event`是事件类型(如'click', 'mouseover'等),`handler`是事件触发时执行的函数。 2. `.click()`: 专门用于绑定点击事件,当用户点击元素时触发指定的函数。 ...
"jquery"是一个广泛使用的JavaScript库,简化了DOM操作、事件处理、动画和AJAX交互,使得前端开发更为便捷。"ajax"即异步JavaScript和XML,是一种在不刷新整个网页的情况下,能够更新部分网页的技术,提高了用户体验...