标准的绑定:
bind(type,[,data],fn)==>第一个参数是事件类型 第二个可选参数作为event.data 传递给事件对象的额外数据对象 第三个参数为用来绑定的处理函数
简写绑定事件:
$('#panel h5.head').mouseover(function(){

});
合成事件:
hover(enter,leave) hover事件用来模拟鼠标的悬停事件 $('.head').hover(function(){},function(){})
toggle(fn1,fn2,fn3....fnN) $('.head').toggle(function(){},function(){}) toggle函数还有一个作用 切换元素的可见状态 $('p').toggle();

事件冒泡:
<div><p><span></span></p></div>例如 在div中添加了点击事件 p也添加了点击事件 span 也添加了点击事件当点击span标签时候会触发三个click事件
这个现象就是事件冒泡
事件冒泡导致的此问题jquery提供了解决方案: event.stopPropagation();

事件对象的属性:
event.type() 获取到事件的类型
event.preventDefault 组织浏览器的默认事件
event.stopPropagation 阻止事件冒泡
event.target 获取事件源
event.pageX()/event.pageY()==>获取光标相对于页面的x坐标和y坐标
event.which() ==>获取作用鼠标的哪个键点击的 1.左键 2.中键 3.右键
移除事件:
unbind $('p').unbind('click');
one(type,[,data],fn) one事件提供了一种方式 一次触发事件后删除
模拟操作:
$('#btn').trigger('click');
其他操作:
同时绑定多个事件类型:
$('div').bind('mouseover mouseout',function(){
$(this).toggleClass('over');
})
添加命名空间:
$('div').bind('click.plugin',function(){})
$('div').bind('mouseover.plugin',function(){})
$('div').bind('dbclick',function(){})
$('button').click(function(){
$('div').unbind('.plugin');
})
事件类型后面添加命名空间,这样删除事件的时候只需要删除命名空间就可以了
触发命名空间的事件:
$(div).trigger('click'); ==>这样有没有命名空间都可以触发
$(div).trigger('click!'); ==>这样有叹号的只能触发不带有命名空间的事件

jQuery--事件总结的更多相关文章

  1. JQuery选择器JQuery 事件

    JQuery 元素选择器 jQuery 使用 CSS 选择器来选取 HTML 元素. $("p") 选取 <p> 元素. $("p.intro") ...

  2. HTML Select 标签选择后触发jQuery事件代码实例

    页面设计原由: 因为很多客户不知道如何来到我们公司,领导想让我在微信公众号上面做一个链接,客户可以直接通过微信公众号打开地图并导航到我们公司的办公地点. 实现起来并不难,但由于公司有很多办事处,所以需 ...

  3. jquery事件核心源码分析

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

  4. 解密jQuery事件核心 - 委托设计(二)

    第一篇 http://www.cnblogs.com/aaronjs/p/3444874.html 从上章就能得出几个信息: 事件信息都存储在数据缓存中 对于没有特殊事件特有监听方法和普通事件都用ad ...

  5. 解密jQuery事件核心 - 模拟事件(四)

    前几章已经把最核心的实现都分解过了,这一章我们看看jQuery是如何实现事件模拟的 在Internet Explorer 8和更低,一些事件change 和 submit本身不冒泡,但jQuery修改 ...

  6. 深入学习jQuery事件对象

    × 目录 [1]获取 [2]事件类型 [3]事件目标[4]当前元素[5]事件冒泡[6]默认行为[7]命名空间[8]返回值[9]键值 前面的话 在触发DOM上的某个事件时,会产生一个事件对象event, ...

  7. 深入学习jQuery事件绑定

    × 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...

  8. jquery 事件冒泡的介绍以及如何阻止事件冒泡

    在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级 ...

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

    jQuery事件系统并没有将事件坚挺函数直接绑定在DOM元素上,而是基于事件缓存模块来管理监听函数的. 二.jQuery事件模块的代码结构 //定义了一些正则 // // //jQuery事件对象 j ...

  10. jQuery事件总结

    blur() 触发或绑定blur事件.$("input").blur(function(){ $("input").css("background-c ...

随机推荐

  1. VR视频外包公司(长年承接虚拟全景外包、虚拟现实视频外包)

    承接VR视频外包(虚拟全景外包),虚拟现实视频外包(北京公司) 我们制作各类型VR全景虚拟现实,增强现实视频制作.录制等项目! 品质保证,售后完备. 我们团队成立于2011年10月,是一个专业从事严肃 ...

  2. EasyUI的combobox控件使用onchange 问题

    在项目中几次都遇到了同样的问题,现在都不知道怎样解决了! 路过的朋友们帮我看看嘛!谢谢了! 最后我想要实现的效果是这样的.   在下拉列表中不存在值.(这里的是下拉列表中存在值的!)  但是在我输入值 ...

  3. Android中实现全屏、无标题栏的两种办法

    在进行UI设计时,我们经常需要将屏幕设置成无标题栏或者全屏.要实现起来也非常简单,主要有两种方法:配置xml文件和编写代码设置. 1.在xml文件中进行配置 在项目的清单文件AndroidManife ...

  4. 01.JavaScript 面向对象精要--原始类型和引用类型

    一.什么是类型 JavaScript 虽然没有类的概念.但依然存在两种类型:原始类型和应用类型. 原始类型保存为简单的数据值,引用类型则保存为对象,其本质是指向内存位置 的引用.也就是说:原始值被直接 ...

  5. CSS样式应用

    CSS样式应用的方法: (1)行内样式,将css样式直接放到标签当中,一般都是放入标签的style属性中,它是最方便的一种样式,也是最不方便修改的样式.如下: (2)内嵌式,通过将css写在网页源文件 ...

  6. 原生javascript实现省市区三级联动

    腾讯IP分享计划(http://ip.qq.com/)有个现成的三级联动功能,查看源码后发现可以直接使用其单独的JS文件(http://ip.qq.com/js/geo.js). 分析后发现自己需要写 ...

  7. 19个必须知道的Visual Studio快捷键(转)

    本文将为大家列出在 Visual Studio 中常用的快捷键,正确熟练地使用快捷键,将大大提高你的编程工作效率. 项目相关的快捷键 Ctrl + Shift + B = 生成项目 Ctrl + Al ...

  8. 编写自定义Yeoman生成器

    转载自JSCON-简时空:<自定义Yeoman生成器> 1.Getting Started 1.1.设置Node模块 Yeoman提供了generator-generator方便快速编写自 ...

  9. PHP之OOP要点摘要

    类和对象:    类是生成对象的模板,对象是活动组件;    面向对象编程实际操作都是通过类的实例(而不是类本身)完成的:    访问控制(public.protected.private):(1) ...

  10. html/css小练习2

    效果图: