浅谈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 测试及效验工具
Apr 18 Javascript
JS 实现Json查询的方法实例
Apr 12 Javascript
JavaScript实现按Ctrl键打开新页面
Sep 04 Javascript
JavaScript设置body高度为浏览器高度的方法
Feb 09 Javascript
JQuery中基础过滤选择器用法实例分析
May 18 Javascript
jQuery对html元素的取值与赋值实例详解
Dec 18 Javascript
基于jquery实现无限级树形菜单
Mar 22 Javascript
ThinkPHP+jquery实现“加载更多”功能代码
Mar 11 Javascript
如何开发出更好的JavaScript模块
Dec 22 Javascript
MUI 实现侧滑菜单及其主体部分上下滑动的方法
Jan 25 Javascript
原生JS实现随机点名项目的实例代码
Apr 30 Javascript
JavaScript实现音乐播放器
Aug 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
DC最新动画电影:《战争之子》为何内容偏激,毁了一个不错的漫画
2020/04/09 欧美动漫
用函数读出数据表内容放入二维数组
2006/10/09 PHP
php 删除cookie方法详解
2014/12/01 PHP
ThinkPHP框架获取最后一次执行SQL语句及变量调试简单操作示例
2018/06/13 PHP
一个小型js框架myJSFrame附API使用帮助
2008/06/28 Javascript
js 数组操作代码集锦
2009/04/28 Javascript
jquery 子窗口操作父窗口的代码
2009/09/21 Javascript
JQuery 中几个类选择器的简单使用介绍
2013/03/14 Javascript
简单的js图片轮换代码(js图片轮播)
2014/05/06 Javascript
浅谈js中变量初始化
2015/02/03 Javascript
JS实现的网页倒计时数字时钟效果
2015/03/02 Javascript
JavaScript实现强制重定向至HTTPS页面
2015/06/10 Javascript
js实现点击文本框显示日期选择器特效代码分享
2020/05/21 Javascript
实例解析JS布尔对象的toString()方法和valueOf()方法
2015/10/25 Javascript
mui上拉加载功能实例详解
2017/04/13 Javascript
nodeJs实现基于连接池连接mysql的方法示例
2018/02/10 NodeJs
Angular学习笔记之集成三方UI框架、控件的示例
2018/03/23 Javascript
node中modules.exports与exports导出的区别
2018/06/08 Javascript
详解JavaScript的变量
2019/04/04 Javascript
JavaScript实现网页动态生成表格
2020/11/25 Javascript
[06:24]DOTA2 2015国际邀请赛中国区预选赛第二日TOP10
2015/05/27 DOTA
[45:25]OG vs EG 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.22
2019/09/05 DOTA
python 从文件夹抽取图片另存的方法
2018/12/04 Python
pycharm修改界面主题颜色的方法
2019/01/17 Python
python如何使用socketserver模块实现并发聊天
2019/12/14 Python
Pyinstaller 打包发布经验总结
2020/06/02 Python
使用Python画了一棵圣诞树的实例代码
2020/11/27 Python
python subprocess pipe 实时输出日志的操作
2020/12/05 Python
python中openpyxl和xlsxwriter对Excel的操作方法
2021/03/01 Python
解决Firefox下不支持outerHTML问题代码分享
2014/06/04 HTML / CSS
公司离职证明范本(5篇)
2014/09/17 职场文书
2014-2015学年工作总结
2014/11/27 职场文书
小班下学期个人总结
2015/02/12 职场文书
“5.12”护士节主持词
2015/07/04 职场文书
Python基础之进程详解
2021/05/21 Python
日元符号 ¥
2022/02/17 杂记