jquery and event

深入理解jQuery的Event机制

jQuery的Event模块非常强大.其功能远远比原生事件监听器强大许多,对同一个元素的监听只用一个eventListener,内部则是一个强大的观察者,根据匹配事件类型触发相应回调.jQuery不仅封装了兼容性差异,还提供了命名空间式注册注销事件,灵活的事件委托(事件代理),手动触发事件trigger以及自定义事件.因为jQuery提供的bind,delegate,live(1.9版本废除了)的功能都是通过on来适配的,所以这里只讲on,off,trigger. 1.注册事件$.fn.on方法…

jquery利用event.which方法获取键盘输入值的代码

jquery利用event.which方法获取键盘输入值的代码,需要的朋友可以参考下. 实例显示按了哪个键: $("input").keydown(function(event){ $("div").html("Key: " + event.which); }); 亲自试一试定义和用法 which 属性指示按了哪个键或按钮. 语法 event.which参数描述 event 必需.规定要检查的事件.这个 event 参数来自事件绑定函数.…

jquery中event对象属性与方法小结

JQuery事件中的Event属性是经常性的被忽略的.大多数时间你的确不怎么用它,但有些时候它还是它还是有作用的.如获知触发时用户的环境(是否按了shift etc).每个浏览器对event都有不同的地方,Jquery对Event做了标准化所以可以放心用. * .target 这个反应触发事件的DOM对象,可以在事件冒泡的时候判断是否是事件源头(compare event.target to this) * .pageX: 鼠标的left属性,相对于page * .pageY: 鼠标的to…

jquery之event与originalEvent的关系、event事件对象用法浅析

在jquery中,最终传入事件处理程序的 event 其实已经被 jQuery 做过标准化处理, 其原有的事件对象则被保存于 event 对象的 originalEvent 属性之中, 每个 event 都是 jQuery.Event 的实例其原型链中保存有六个方法, 代码如下复制代码 jQuery.Event.prototype = { preventDefault: function() { // 取消事件默认行为 }, stopPropagat…

jquery阻止事件冒泡 event.stopPropagation(); event.cancelBubble = true; jquery阻止默认操作 event.preventDefault(); event.returnValue = false; http://blog.csdn.net/JeamKing/article/details/5332328 http://www.cnblogs.com/mofish/archive/2011/08/05/2128929.html addEv…

jquery 关于event.target使用的几点说明介绍

event.target说明:引发事件的DOM元素. this和event.target的区别js中事件是会冒泡的,所以this是可以变化的,但event.target不会变化,它永远是直接接受事件的目标DOM元素: this和event.target的相同点this和event.target都是dom对象,如果要使用jquey中的方法可以将他们转换为jquery对象:$(this)和$(event.target); 这使我想起了以前写的一个例子: 代码如下: //del event …

jQuery 嵌套 event 会触发多次的原因

Html代码如下: <div id="cover"> <input type="button" id="inside" value="submit_inside" /> </div> <div id="cover_js"> <input type="button" id="inside_js" value=&quo…

jquery mobile event

jquery.js $(document).on("mobileinit", function() { // }); jquery.mobile.js $(document).ready(); $(document).bind("pageinit", function() { // }) mobileinit pagecreate markup is enhanced document.ready pageinit…

JQuery中event的preventDefault和stopPropagation介绍

event.preventDefault()阻止默认事件行为的触发. event.stopPropagation()防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数. <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/ht…

jQuery的event事件

1.冒泡和默认行为 <div class="aa"> <div class="bb"> <div class="cc"> <em> <strong> 冒泡测试3 </strong> </em> </div> </div> </div> <div> <form action="http://www.ba…

jquery bind event， use on. $(document).on("click","#a",function(){alert(1)}) [#document]

$(document).on("click","#a",function(){alert(1)}) [#document] as a replacement of previous delegate etc.. event capture netscape 和微软曾经的战争还是比较火热的,当时, netscape 主张捕获方式,微软主张冒泡方式.后来 w3c 采用折中的方式,平息了战火,制定了统一的标准——先捕获再冒泡. 事件的触发有三个阶段 document…

jQuery通过event获取点击事件的事件对象

要想搞明白js的事件机制,必须搞清楚几个概念:事件对象,事件源,还有事件流事件对象: 当事件发生时会产生事件对象,事件对象的作用是用来记录“事件发生是一些相关的信息.注意事件对象只有在事件发生时才会产生,我们无法手动创建,并且事件对象只能在处理函数内部访问,处理函数允许结束后该对象自动销毁. 怎么理解那?? 如上代码,当onmousemove事件发生时,就会产生一个事件对象,就是程序中的event对象,我们只能在这个匿名函数中访问到这个event对象,在函数外面是访问不到的,同样我们也无法手动…

jquery on event

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>on demo</title> <style> p { background: yellow; font-weight: bold; cursor: pointer; padding: 5px; } p.over { background: #c…

jQuery中event.target和this的区别

http://www.cnblogs.com/hhsy/p/5647930.html 该链接有详细讲解…

[jQuery] Custom event trigger

$(document).ready(function(){ // Get Weather $('button').on('show.weather', function() { var results = $(this).closest('li').find('.results'); results.append('<p>Weather: 74°</p>'); $(this).off('show.weather'); }); // Show Photos $('button').o…

JQuery Event属性说明

JQuery事件中的Event属性是经常性的被忽略的.大多数时间你的确不怎么用它,但有些时候它还是有作用的. 如获知触发时用户的环境(是否按了shift etc).每个浏览器对event都有不同的地方,Jquery对Event做了标准化所以可以放心用. * .target 这个反应触发事件的DOM对象,可以在事件冒泡的时候判断是否是事件源头(compare event.target to this) * .pageX: 鼠标的left属性,相对于page * .pageY: 鼠标的top属…

jQuery Event.stopPropagation() 函数详解

stopPropagation()函数用于阻止当前事件在DOM树上冒泡. 根据DOM事件流机制,在元素上触发的大多数事件都会冒泡传递到该元素的所有祖辈元素上,如果这些祖辈元素上也绑定了相应的事件处理函数,就会触发执行这些函数. 使用stopPropagation()函数可以阻止当前事件向祖辈元素的冒泡传递,也就是说该事件不会触发执行当前元素的任何祖辈元素的任何事件处理函数. 该函数只阻止事件向祖辈元素的传播,不会阻止该元素自身绑定的其他事件处理函数的函数.event.stopImmediateP…

JQuery常用API 核心效果 JQueryHTML 遍历 Event事件

JQuery 常用API 参考资料:JQuery 官网 jQuery API 中文文档核心 jQuery 对象 jQuery() 返回匹配的元素集合,无论是通过在DOM的基础上传递的参数还是创建一个HTML字符串. jQuery.noConflict( [removeAll ] ) 放弃jQuery控制$ 变量. 实用工具Utilities jQuery.parseJSON() jQuery.parseJSON() 接受一个标准格式的 JSON 字符串,并返回解析后的 JavaScrip…

jQuery Event.which 属性

which属性用于返回触发当前事件时按下的键盘按键或鼠标按钮. 对于键盘和鼠标事件,该属性用于确定你按下的是哪一个键盘按键或鼠标按钮. which属性对DOM原生的event.keyCode和event.charCode进行了标准化. 适用的事件类型主要有键盘事件:keypress.keydown.keyup,以及鼠标事件:mouseup.mousedown. 该属性属于jQuery的Event对象(实例). 语法 jQuery 1.1.3 新增该属性. eventObject.which 返回…

jQuery源码分析--Event模块（1）

jQuery的Event模块提供了强大的功能:事件代理,自定义事件,自定义数据等.今天记录一下它实现的原理. 我们都知道,在js的原生事件中,有事件对象和回调函数这两样东西.但是事件对象是只读的,所以jQuery就用了自己的Event对象替代了原生的事件对象,这样就可以实现对事件对象的完全控制,所以才能实现自定义数据.而回调函数的话,每个元素只有一个一样的回调函数,这样方便管理. 下面来看看event对象长什么样. 可以看到jQuery的事件对象其实一开始就只有这么一点东西.其中original…

jQuery Event.which 属性详解

jQuery Event.which 属性详解 which属性用于返回触发当前事件时按下的键盘按键或鼠标按钮. 对于键盘和鼠标事件,该属性用于确定你按下的是哪一个键盘按键或鼠标按钮. which属性对DOM原生的event.keyCode和event.charCode进行了标准化. 适用的事件类型主要有键盘事件:keypress.keydown.keyup,以及鼠标事件:mouseup.mousedown. 该属性属于jQuery的Event对象(实例). 语法 jQuery 1.1.3 新增该…

jQuery Event.stopImmediatePropagation() 函数详解

stopImmediatePropagation()函数用于阻止剩余的事件处理函数的执行,并防止当前事件在DOM树上冒泡. 根据DOM事件流机制,在元素上触发的大多数事件都会冒泡传递到该元素的所有祖辈元素上,如果这些祖辈元素上也绑定了相应的事件处理函数,就会触发执行这些函数. 使用stopImmediatePropagation()函数可以阻止当前事件向祖辈元素的冒泡传递,也就是说该事件不会触发执行当前元素的任何祖辈元素的任何事件处理函数. 此外,与event.stopPropagation()…

jQuery之常用且重要方法梳理（target,arguments,slice,substring,data,trigger,Attr）-（一）

1.jquery data(name) data() 方法向被选元素附加数据,或者从被选元素获取数据. $("#btn1").click(function(){ $("div").data("greeting", "Hello World"); }); $("#btn2").click(function(){ alert($("div").data("greeting&quo…

JavaScript事件详解-jQuery的事件实现（三）

正文本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的event模块来说,jQuery的event那真是难读了很多,先从大神Dean Edward的addEvent开始入手吧,地址在这里.源码不长 function addEvent(element,type,handler){ if(element.addEventListener){ element.…

jquery事件核心源码分析

我们从绑定事件开始,一步步往下看: 以jquery.1.8.3为例,平时通过jquery绑定事件最常用的是on方法,大概分为下面3种类型: $(target).on('click',function(){ //函数内容 }) $(target).on('click','.child',function(){ //函数内容 }) $(target).on({ click:function(){}, mouseover:function(){}, mouseout:function(){} }) 第…

解密jQuery事件核心 - 绑定设计（一）

说起jQuery的事件,不得不提一下Dean Edwards大神 addEvent库,很多流行的类库的基本思想从他那儿借来的 jQuery的事件处理机制吸取了JavaScript专家Dean Edwards编写的事件处理函数的精华,使得jQuery处理事件绑定的时候相当的可靠. 在预留退路(graceful degradation),循序渐进以及非入侵式编程思想方面,jQuery也做的非常不错事件的流程图总的来说对于JQuery的事件绑定在绑定的时候做了包装处理在执行的时候有过滤器处理…

解密jQuery事件核心 - 自定义设计（三）

接上文http://www.cnblogs.com/aaronjs/p/3447483.html 本文重点:自定义事件 “通过事件机制,可以将类设计为独立的模块,通过事件对外通信,提高了程序的开发效率.” 对象之间通过直接方法调用来交互 1)对象A直接调用对象B的某个方法,实现交互:直接方法调用本质上也是属于一种特殊的发送与接受消息,它把发送消息和接收消息合并为一个动作完成: 方法调用方和被调用方被紧密耦合在一起:因为发送消息和接收消息是在一个动作内完成,所以无法做到消息的异步发送和接收: 2)…

深入学习jQuery事件对象

× 目录 [1]获取 [2]事件类型 [3]事件目标[4]当前元素[5]事件冒泡[6]默认行为[7]命名空间[8]返回值[9]键值前面的话在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息.所有浏览器都支持event对象,但支持方式不同.jQuery在遵循W3C规范的情况下,对事件对象的常用属性进行了封装,使得事件处理在各个浏览器下都可以正常运行而不需要进行浏览器类型判断,本文将详细介绍jQuery事件对象获取对于DOM事件对象来说,标准浏览器…

js获取键盘按下的键值event.keyCode,event.charCode,event.which的兼容性

js获取键盘按下的键值有event.keyCode,event.charCode和event.which 其中: 谷歌浏览器对event.keyCode,event.charCode和event.which都兼容. 火狐浏览器对event.keyCode部分键值有效,如上下左右键(37,38,39,40),enter键(13),PgUp(33),PgDn(34)等部分有效,对数字键,字母键无效. event.which也是部分键值有效,如字母键,数字键,enter键,Backspace键等有效,…

jQuery源代码学习之九—jQuery事件模块

jQuery事件系统并没有将事件坚挺函数直接绑定在DOM元素上,而是基于事件缓存模块来管理监听函数的. 二.jQuery事件模块的代码结构 //定义了一些正则 // // //jQuery事件对象 jQuery.event={ global:{}, add:function(elem,types,handle,data,selector){}, remove:function(elem,types,handler,selector,mapppedTypes){}, trigger:functio…

【jquery and event】的更多相关文章