浅谈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 ajax 同步异步的执行 return值不能取得的解决方案
Jan 08 Javascript
JavaScript对数组进行随机重排的方法
Jul 22 Javascript
第十篇BootStrap轮播插件使用详解
Jun 21 Javascript
jQuery ajax实现省市县三级联动
Mar 07 Javascript
JS和JQuery实现雪花飘落效果
Nov 30 jQuery
JS实现的简单下拉框联动功能示例
May 11 Javascript
vue实现底部菜单功能
Jul 24 Javascript
微信小程序实现左滑修改、删除功能
Oct 19 Javascript
vue实现多组关键词对应高亮显示功能
Jul 25 Javascript
使用Layer组件弹出多个对话框(非嵌套)与关闭及刷新的例子
Sep 25 Javascript
微信小程序indexOf的替换方法(推荐)
Jan 14 Javascript
微信小程序实现页面左右滑动
Nov 16 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载入图像imagecreatefrom_gif_jpeg_png系列函数用法分析
2016/11/14 PHP
PHP PDOStatement::bindValue讲解
2019/01/30 PHP
JSON 学习之完全手册 图文
2007/05/29 Javascript
js兼容标准的表格变色效果
2008/06/28 Javascript
通过下拉框的值来确定输入框是否可以为空的代码
2011/10/18 Javascript
JavaScript学习笔记(一) js基本语法
2011/10/25 Javascript
用JQUERY增删元素的代码
2012/02/14 Javascript
浅谈JavaScript function函数种类
2014/12/29 Javascript
JavaScript中Cookies的相关使用教程
2015/06/04 Javascript
详解JavaScript中数组的相关知识
2015/07/29 Javascript
JavaScript操作class和style样式代码详解
2016/02/13 Javascript
分享12个非常实用的JavaScript小技巧
2016/05/11 Javascript
JavaScript中动态向表格添加数据
2017/01/24 Javascript
JavaScript学习笔记之函数记忆
2017/09/06 Javascript
基于webpack4搭建的react项目框架的方法
2018/06/30 Javascript
对vue事件的延迟执行实例讲解
2018/08/28 Javascript
详解vue使用$http服务端收不到参数
2019/04/19 Javascript
JS实现可控制的进度条
2020/03/25 Javascript
vue深度监听(监听对象和数组的改变)与立即执行监听实例
2020/09/04 Javascript
浅谈vue使用axios的回调函数中this不指向vue实例,为undefined
2020/09/21 Javascript
利用vue3+ts实现管理后台(增删改查)
2020/10/30 Javascript
Python基于dom操作xml数据的方法示例
2018/05/12 Python
Python OpenCV中的numpy与图像类型转换操作
2020/12/11 Python
深入解读CSS3中transform变换模型的渲染
2016/05/27 HTML / CSS
HTML5、Select下拉框右边加图标的实现代码(增进用户体验)
2017/10/16 HTML / CSS
阿迪达斯墨西哥官方网站:adidas墨西哥
2017/11/03 全球购物
南京某公司笔试题
2013/01/27 面试题
广告学专业毕业生自荐信
2013/09/24 职场文书
银行财务部实习生的自我鉴定
2013/11/27 职场文书
预防传染病方案
2014/06/14 职场文书
经费申请报告
2015/05/15 职场文书
我的长征观后感
2015/06/09 职场文书
python基础之文件处理知识总结
2021/05/23 Python
Vue的列表之渲染,排序,过滤详解
2022/02/24 Vue.js
mysql 索引的数据结构为什么要采用B+树
2022/04/26 MySQL
SQL bool盲注和时间盲注详解
2022/07/23 SQL Server