jQuery事件机制

1 事件操作

1.1 页面载入事件

$(document).ready(function(){// 在这里写你的代码... }); 或者 $(function($) { // 你可以在这里继续使用$作为别名... }); 

1.2 事件绑定

on(eve,[sel],[data],fn)      1.7  在选择元素上绑定一个或多个事件的事件处理函数
bind(type,[data],fn)         3.0- 请使用on()
one(type,[data],fn)            为每一个匹配元素的特定事件(像click)绑定一个一次性的事件处理函数

1.3 解除事件绑定

off(eve,[sel],[fn])         1.7  在选择元素上移除一个或多个事件的事件处理函数
unbind(t,[d|f])                3.0- 请使用off()

1.4 触发事件

trigger(type,[data])         在每一个匹配的元素上触发某类事件triggerHandler(type, [data]) 
这个特别的方法将会触发指定的事件类型上所有绑定的处理函数。但不会执行浏览器默认动作,也不会产生事件冒泡
这个方法的行为表现与trigger类似,但有以下三个主要区别:
* 第一,他不会触发浏览器默认事件。
* 第二,只触发jQuery对象集合中第一个元素的事件处理函数。
* 第三,这个方法的返回的是事件处理函数的返回值,而不是据有可链性的jQuery对象。此外,如果最开始的jQuery对象集合为空,则这个方法返回 undefined 。

1.5 事件委派

live(type,[data],fn)    1.7-
die(type,[fn])            1.7-
delegate(s,[t],[d],fn)    3.0-
undelegate([s,[t],fn])    3.0-
全部移除了,请使用 on()
$(document).on('click', 'button', fn)

1.6 事件切换

hover([over,]out)           一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法
toggle([spe],[eas],[fn])   1.9-用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件

2 事件列表

blur([[data],fn])
change([[data],fn])
click([[data],fn])
dblclick([[data],fn])
error([[data],fn])
focus([[data],fn])
focusin([data],fn)         当元素获得焦点时,触发 focusin 事件。 focusin事件跟focus事件区别在于,他可以在父元素上检测子元素获取焦点的情况focusout([data],fn)当元素失去焦点时触发 focusout 事件。focusout事件跟blur事件区别在于,他可以在父元素上检测子元素失去焦点的情况。keydown([[data],fn])
keypress([[data],fn])
keyup([[data],fn])
mousedown([[data],fn])
mouseenter([[data],fn])当鼠标指针穿过元素时,会发生 mouseenter 事件。该事件大多数时候会与mouseleave 事件一起使用。与 mouseover 事件不同,只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。如果鼠标指针穿过任何子元素,同样会触发 mouseover 事件。mouseleave([[data],fn])当鼠标指针离开元素时,会发生 mouseleave 事件。该事件大多数时候会与mouseenter 事件一起使用。与 mouseout 事件不同,只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件。如果鼠标指针离开任何子元素,同样会触发 mouseout 事件。mousemove([[data],fn])
mouseout([[data],fn])
mouseover([[data],fn])
mouseup([[data],fn])
resize([[data],fn])
scroll([[data],fn])
select([[data],fn])
submit([[data],fn])
unload([[data],fn])

3 事件对象

属性

eve.currentTarget        在事件冒泡阶段中的当前DOM元素
eve.data                当前执行的处理器被绑定的时候,包含可选的数据传递给jQuery.fn.bind
eve.delegateTarget        1.7  当currently-called的jQuery事件处理程序附加元素
eve.namespace            当事件被触发时此属性包含指定的命名空间
eve.pageX                鼠标相对于文档的左边缘的位置
eve.pageY                鼠标相对于文档的顶部边缘的位置
eve.relatedTarget        在事件中涉及的其它任何DOM元素
eve.result                这个属性包含了当前事件事件最后触发的那个处理函数的返回值,除非值是 undefined
eve.target                最初触发事件的DOM元素
eve.timeStamp            返回事件触发时距离1970年1月1日的毫秒数
eve.type                事件类型
eve.which                针对键盘和鼠标事件,这个属性能确定你到底按的是哪个键或按钮

方法

eve.preventDefault()            阻止默认事件行为的触发
eve.isDefaultPrevented()        根据事件对象中是否调用过 event.preventDefault() 方法来返回一个布尔值
eve.stopPropagation()            防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数
eve.isPropagationStopped()        检测 event.stopPropagation() 是否被调用过
eve.stopImmediatePropagation()     阻止剩余的事件处理函数执行并且防止事件冒泡到DOM树上
eve.isImmediatePropagation()     检测 event.stopImmediatePropagation() 是否被调用过

更多专业前端知识,请上 【猿2048】www.mk2048.com

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/363819.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

struts中多个模块时,使用多个struts-config.xml文件之间时如何切换的!

1.配置web.xml文件&#xff0c;通知控制器&#xff1a; <!-----------------这个是默认的--------------------------> <init-param> <param-name>config</param-name> <param-value>/WEB-INF/struts-config.xml</param-valu…

关于JVM和JIT的一点点

如您所知&#xff0c;JVM&#xff08;Java Virtusal Machine&#xff09;使Java能够遵循“一次写入&#xff0c;随处运行”的范例。 JVM的核心包括以下组件&#xff1a; 堆 堆 PermGen和方法区域 JIT编译器 代码缓存 堆是在应用程序代码开发阶段为您使用的每个新运算符分…

kali vmtools 不能复制粘贴解决方法(绝对实用)

朋友问起怎么vm kali 2019怎么不能复制了&#xff0c;而且网上的方法大多不适合。我就在这儿记录一笔吧&#xff0c;方便大家。 之前发现最新kali复制粘贴不能用&#xff0c;后来发现一个奇妙的套路&#xff0c;不是共享文件夹。只需要把文件复制到命令行中&#xff0c;会出现t…

web前端-回调函数sort详解

<!DOCTYPE html><html lang"en"><head> <meta charset"UTF-8"> <title>JS函数</title></head><body> <script> //回调函数 &#xff08;高阶函数&#xff09; function fn(f1, f2) { return f1(1) …

MineCraft和堆外内存

总览 MineCraft是一个很好的例子&#xff0c;说明何时堆外内存确实可以提供帮助。 关键要求是&#xff1a; 保留的数据大部分是一个简单的数据结构&#xff08;在我的世界的情况下&#xff0c;它的很多字节[]&#xff09; 堆外内存的使用可以隐藏在抽象中。 考试 我使用以下测…

kubernetes进阶之七:Service

1.概述 Service也是Kubernetes里的最核心的资源对象之一&#xff0c;Kubernetes里的每个Service其实就是我们经常提起的微服务架构中的一个“微服务”&#xff0c;之前我们所说的Pod、RC等资源对象其实都是为这节所说的“服务”------Kubernetes Service作“嫁衣”的。图1.12显…

IE Firefox css 差别 [转]

1、单位问题问题&#xff1a;任何距离的数值ie可以不加单位&#xff0c;ff必须要求写单位&#xff08;0除外&#xff09; 解决&#xff1a;写全单位如padding:0px;2、水平居中问题&#xff1a;div里的内容&#xff0c;ie默认为center&#xff0c;而ff默认left 解决&#xff1a;…

Inside Kolla - 04 Kolla 目录结构

Kolla 目录结构 把 Kolla 的源代码下载下来后&#xff0c;先从总体上分析 Kolla 的目录结构&#xff0c;查看顶层目录结构&#xff0c;使用 tree -L 1 输出 . ├── ansible ├── compose ├── demos ├── devenv ├── docker ├── docs ├── LICENSE ├── READ…

Json Schema的使用

直接上案例&#xff1a; 在Web Api通讯中&#xff0c;客户端发送json数据&#xff0c;服务端反序列化json&#xff08;json与某个类形成对应关系&#xff09;&#xff0c;在某些情况下&#xff0c;需要校验其上传的json是否合法。 服务端是使用Json.net(newtonsoft.json)进行…

红帽企业版linux 7.4更新启动,红帽Linux企业版7.4 淘汰Btrfs文件系统

我们不得不承认Btrfs是一种古老的文件系统&#xff0c;当初(2007年)是由甲骨文宣布并进行中的COW(copy-on-write式)文件系统&#xff0c;意图取代Linux的ext。但是天不遂人愿&#xff0c;2011年8月9日&#xff0c;Fedora就决定Btrfs不再作为Fedora 16默认文件系统&#xff0c;走…

关于控件postback 后viewstate加载失败的问题

我写了一个控件Inherits TextBox&#xff0c;里面有一个复杂属性Tip&#xff0c;但每次postback的时候都说加载viewstate失败&#xff0c;除非我在!postback的情况下给Tip.xxx赋值. 下面我贴出代码&#xff0c;我已经搞了一天了&#xff0c;搞不出什么原因。 JTextBox控件 usin…

Java 8 Friday:语言设计很微妙

在Data Geekery &#xff0c;我们喜欢Java。 而且&#xff0c;由于我们真的很喜欢jOOQ的流畅的API和查询DSL &#xff0c;我们对Java 8将为我们的生态系统带来什么感到非常兴奋。 Java 8星期五 每个星期五&#xff0c;我们都会向您展示一些不错的教程风格的Java 8新功能&#…

linux下如何查看当前机器提供了哪些服务

答:使用netstat工具 在命令行下输入netstat -atun即可列出当前机器提供的服务 netstat各选项解析: -a 列出所有服务 -t 列出tcp相关 -u 列出udp相关 -n 以数字形式显示主机、端口或用户名转载于:https://www.cnblogs.com/dakewei/p/10414450.html

天猫浏览型应用的CDN静态化架构演变(转)

在天猫双11活动中&#xff0c;商品详情、店铺等浏览型系统&#xff0c;通常会承受超出日常数倍甚至数十倍的流量冲击。随着历年来双11流量的大幅增加&#xff0c;每年这些浏览型 系统都要面临容量评估、硬件扩容、性能优化等各类技术挑战。因此&#xff0c;架构方面的重点在于&…

jQuery表单验证的几种方法

1.jQuery的框架的验证&#xff1a;validate框架 Jquery Validate 验证规则 (1)required:true 必输字段(2)remote:”check.PHP” 使用ajax方法调用check.php验证输入值(3)email:true 必须输入正确格式的电子邮件(4)url:true 必须输入正确格式的网址(5)date:true 必须输入正确格…

h3c的gpu安装linux系统,h3c服务器u盘安装linux系统安装

弹性云服务器 ECS弹性云服务器(Elastic Cloud Server)是一种可随时自助获取、可弹性伸缩的云服务器&#xff0c;帮助用户打造可靠、安全、灵活、高效的应用环境&#xff0c;确保服务持久稳定运行&#xff0c;提升运维效率三年低至5折&#xff0c;多种配置可选了解详情什么是弹性…

查看您的Solr缓存大小:Eclipse Memory Analyzer

Solr使用不同的缓存来防止请求期间过多的IO访问和计算。 当索引不是很频繁发生时&#xff0c;您可以通过使用这些缓存来获得巨大的性能提升。 根据索引数据的结构和缓存的大小&#xff0c;它们可能会变得很大&#xff0c;并占用堆内存的很大一部分。 在本文中&#xff0c;我想展…

义务植树活动的实质

今天早上,公司来俩横横的人&#xff0c;门也不敲&#xff0c;闯进来就要找负责人&#xff0c;说他是绿化委员会的&#xff0c;问公司多少人&#xff0c;实事求是地答了。以为什么事儿呢&#xff0c;答完人家说送一通知&#xff0c;通知3月16日你们公司全体人员到新密白寨镇植树…

[Swift]LeetCode1118. 一月有多少天 | Number of Days in a Month

★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号&#xff1a;山青咏芝&#xff08;shanqingyongzhi&#xff09;➤博客园地址&#xff1a;山青咏芝&#xff08;https://www.cnblogs.com/strengthen/&#xff09;➤GitHub地址&a…

7、说说自定义注解的场景及实现

登陆、权限拦截、日志处理&#xff0c;以及各种 Java 框架&#xff0c;如 Spring&#xff0c;Hibernate&#xff0c;JUnit 提到注解就不能不说反射&#xff0c;Java 自定义注解是通过运行时靠反射获取注解。实际开发中&#xff0c;例如我们要获取某个方法的调用日志&#xff0c…