浅谈jQuery中的事件


Posted in Javascript onMarch 23, 2015

JQuery事件初见

1.JQuery中的事件绑定

其实呢,JQuery中标准的事件绑定是这样写下:(如下)

$("#btn").bind("click",function(){});

但是每次这样写,太过麻烦,还怎么做到Write less,Do more?
所以我们习惯的简写成。

$("#btn").click(function(){  })  这样就方便了好多

2.合成事件hover(enterfn,leavefn)

当鼠标放在元素上的时候调用enterfn方法,
当鼠标离开元素的时候调用leavefn方法。
相当于javascript中的mouseover与mouseout事件的结合体。

事件冒泡

1.描述

事件冒泡:JQuery中也像JavaScript一样,采用事件冒泡的机制。
、window.event.cancelBubble = true

2.获取

如果想要捕获事件的相关信息,就要给响应的匿名函数增加一个参数:e,e就是事件对象。
调用事件对象的stopPropagation()方法终止冒泡。
例如,e.stopPropagation();
终止冒泡以后,程序就不会再事件源的父元素上执行。

3.事件冒泡图示

浅谈jQuery中的事件

阻止事件

阻止默认行为:有的元素有默认行为,比如超链接点击后会转向新链接、提交按钮默认会提交表单,如果想阻止默认行为只要调用事件对象的preventDefault()方法和window.event.returnValue=false效果一样。

$(“a”).click(function(e) {

          alert(“所有超链接暂时全部禁止点击”);

         e.preventDefault();

       });

以上所述就是本文关于jQuery事件的全部描述了,希望对大家学习jQuery能够有所帮助。

Javascript 相关文章推荐
JavaScript入门之对象与JSON详解
Oct 21 Javascript
js监听滚动条滚动事件使得某个标签内容始终位于同一位置
Jan 24 Javascript
使用js实现关闭js弹出层的窗口
Feb 10 Javascript
JQuery插件Quicksand实现超炫的动画洗牌效果
May 03 Javascript
深入探讨Vue.js组件和组件通信
Sep 12 Javascript
基于JavaScript实现的快速排序算法分析
Apr 14 Javascript
Vue中的ref作用详解(实现DOM的联动操作)
Aug 21 Javascript
解决webpack无法通过IP地址访问localhost的问题
Feb 22 Javascript
AngularJS创建一个上传照片的指令实例代码
Feb 24 Javascript
vue :src 文件路径错误问题的解决方法
May 15 Javascript
小程序二次贝塞尔曲线实现购物车商品曲线飞入效果
Jan 07 Javascript
ES6顶层对象、global对象实例分析
Jun 14 Javascript
JavaScript实现俄罗斯方块游戏过程分析及源码分享
Mar 23 #Javascript
JavaScript判断表单提交时哪个radio按钮被选中的方法
Mar 21 #Javascript
JavaScript动态修改网页元素内容的方法
Mar 21 #Javascript
JavaScript实现向OL列表内动态添加LI元素的方法
Mar 21 #Javascript
JavaScript实现当网页加载完成后执行指定函数的方法
Mar 21 #Javascript
JavaScript动态加载样式表的方法
Mar 21 #Javascript
JavaScript获得url所有参数键值表的方法
Mar 21 #Javascript
You might like
PHP4与PHP3中一个不兼容问题的解决方法
2006/10/09 PHP
PHP 文件上传进度条的两种实现方法的代码
2007/11/25 PHP
基于php无限分类的深入理解
2013/06/02 PHP
php强制用户转向www域名的方法
2015/06/19 PHP
PHP 返回13位时间戳的实现代码
2016/05/13 PHP
php array_values 返回数组的值实例详解
2016/11/17 PHP
源码分析 Laravel 重复执行同一个队列任务的原因
2017/12/25 PHP
PHP实现的权重算法示例【可用于游戏根据权限来随机物品】
2019/02/15 PHP
jQuery EasyUI API 中文文档 - TreeGrid 树表格使用介绍
2011/11/21 Javascript
基于JavaScript 声明全局变量的三种方式详解
2013/05/07 Javascript
jquery单行文字向上滚动效果示例
2014/03/06 Javascript
js生成随机数的方法实例
2015/10/16 Javascript
js实现表单及时验证功能 用户信息立即验证
2016/09/13 Javascript
如何用js判断dom是否有存在某class的值
2017/02/13 Javascript
浅谈js基础数据类型和引用类型,深浅拷贝问题,以及内存分配问题
2017/09/02 Javascript
微信小程序搜索功能(附:小程序前端+PHP后端)
2019/02/28 Javascript
ES6的异步终极解决方案分享
2019/07/11 Javascript
用virtualenv建立多个Python独立虚拟开发环境
2017/07/06 Python
Python中scatter函数参数及用法详解
2017/11/08 Python
python Matplotlib画图之调整字体大小的示例
2017/11/20 Python
Python爬虫中urllib库的进阶学习
2018/01/05 Python
python中什么是面向对象
2020/06/11 Python
Pycharm操作Git及GitHub的步骤详解
2020/10/27 Python
Python常用外部指令执行代码实例
2020/11/05 Python
Python如何实现感知器的逻辑电路
2020/12/25 Python
印度尼西亚综合购物网站:Lazada印尼
2016/09/07 全球购物
财务管理专业毕业生求职信范文
2013/09/21 职场文书
顶撞老师检讨书
2014/02/07 职场文书
2014年关于两会精神的心得体会
2014/03/17 职场文书
工程造价专业求职信
2014/07/17 职场文书
单位委托书怎么写
2014/08/02 职场文书
开展创先争优活动总结
2014/08/28 职场文书
学校政风行风评议心得体会
2014/10/21 职场文书
目标责任书格式范文
2015/05/11 职场文书
Python中的pprint模块
2021/11/27 Python
vue 自定义组件添加原生事件
2022/04/21 Vue.js