浅谈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 相关文章推荐
jquery下实现overlay遮罩层代码
Aug 25 Javascript
JavaScript入门之基本函数详解
Oct 21 Javascript
jQuery 淡出一个图像到另一个图像的实现代码
Jun 12 Javascript
jquery ajax中使用jsonp的限制解决方法
Nov 22 Javascript
js光标定位文本框回车表单提交问题的解决方法
May 11 Javascript
JS实现兼容性好,自动置顶的淘宝悬浮工具栏效果
Sep 18 Javascript
AngularJS单选框及多选框实现双向动态绑定
Jan 13 Javascript
微信小程序视图template模板引用的实例详解
Sep 20 Javascript
js仿微信抢红包功能
Sep 25 Javascript
完美解决iview 的select下拉框选项错位的问题
Mar 02 Javascript
JS中通过url动态获取图片大小的方法小结(两种方法)
Oct 31 Javascript
JavaScript单线程和任务队列原理解析
Feb 04 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
PHP语法速查表
2007/01/02 PHP
php 8小时时间差的解决方法小结
2009/12/22 PHP
destoon二次开发模板及调用语法汇总
2014/06/21 PHP
php实现替换手机号中间数字为*号及隐藏IP最后几位的方法
2016/11/16 PHP
控制台报错object is not a function的解决方法
2014/08/24 Javascript
5种处理js跨域问题方法汇总
2014/12/04 Javascript
Javascript实现多彩雪花从天降散落效果的方法
2015/02/02 Javascript
用JavaScript实现页面重定向功能的教程
2015/06/04 Javascript
快速学习JavaScript的6个思维技巧
2015/10/13 Javascript
jquery自定义右键菜单、全选、不连续选择
2016/03/01 Javascript
微信小程序 wxapp地图 map详解
2016/10/31 Javascript
assert()函数用法总结(推荐)
2017/01/25 Javascript
利用Jquery实现几款漂亮实用的时间轴(附示例代码)
2017/02/15 Javascript
微信小程序网络请求封装示例
2018/07/24 Javascript
基于JS开发微信网页录音功能的实例代码
2019/04/30 Javascript
Vue路由模块化配置的完整步骤
2019/08/14 Javascript
[17:00]DOTA2 HEROS教学视频教你分分钟做大人-帕克
2014/06/10 DOTA
详解Python中的多线程编程
2015/04/09 Python
Python实现将多个空格换为一个空格.md的方法
2018/12/20 Python
简单了解python高阶函数map/reduce
2019/06/28 Python
深入浅析python3中的unicode和bytes问题
2019/07/03 Python
PyCharm刷新项目(文件)目录的实现
2020/02/14 Python
Python实现链表反转的方法分析【迭代法与递归法】
2020/02/22 Python
让Django的BooleanField支持字符串形式的输入方式
2020/05/20 Python
keras和tensorflow使用fit_generator 批次训练操作
2020/07/03 Python
Python爬虫之爬取淘女郎照片示例详解
2020/07/28 Python
python实现发送带附件的邮件代码分享
2020/09/22 Python
html5 canvas绘制矩形和圆形的实例代码
2016/06/16 HTML / CSS
如何选择使用结构还是类
2014/05/30 面试题
校园元旦活动总结
2014/07/09 职场文书
12.4法制宣传日活动总结
2014/08/26 职场文书
三问三解心得体会
2014/09/05 职场文书
党员“四风”问题批评与自我批评思想汇报
2014/10/06 职场文书
教师党的群众路线教育实践活动个人整改措施
2014/11/04 职场文书
《小蝌蚪找妈妈》教学反思
2016/02/23 职场文书
redis protocol通信协议及使用详解
2022/07/15 Redis