jQuery常用的Mouse事件有7种,分别是: mouseup:鼠标在元素上松开时触发 mouseup 事件。与 click 不同,只要鼠标在元素上松开即触发。...mousedown:鼠标在元素上并按下时触发 mousedown 事件。与 click 不同,只要鼠标在元素上按下即触发。...mouseover:当鼠标位于元素上时触发 mouseover 事件,通常与 mouseout 配合使用。...mouseout:鼠标在元素上移开时触发 mouseout 事件。 mouseleave:鼠标在元素上移开时触发 mouseleave 事件。...mouseup 和 mousedown 没什么好解释的,主要说一下 mouseover 和 mouseenter ; mouseout 和 mouseleave 的区别。
前言 在web页面上经常遇到的鼠标事件有:鼠标悬停操作,鼠标右键,鼠标长按,拖拽等操作 trigger() trigger 方法用于在 DOM 元素上触发事件 语法使用示例 .trigger(eventName...') // 触发 mousedown 事件 不正确的用法 cy.trigger('touchstart') // 错误,不能直接用在cy. cy.location().trigger...参数说明 eventName(字符串) event 在DOM元素上要触发的的名称。 position(字符串) 应该触发事件的位置。该center位置是默认位置。...defaultCommandTimeout 等待超时.trigger()之前解决的时间 您还可以任意事件属性(例如clientX,shiftKey),他们会被附加到事件。...鼠标事件 鼠标悬停操作 触发 mouseover 事件,鼠标悬停操作。
与 click 不同,只要鼠标在元素上松开即触发(左右键都行)。mousedown:鼠标在元素上并按下时触发 mousedown 事件。与 click 不同,只要鼠标在元素上按下即触发(左右键都行)。...mouseover:当鼠标位于元素上时触发 mouseover 事件,通常与 mouseout 配合使用。...mouseenter:当鼠标位于元素上时触发 mouseenter 事件,通常与 mouseleave 配合使用。mousemove:鼠标在元素上移动时触发 moudemove 事件。...mouseout:鼠标在元素上移开时触发 mouseout 事件。mouseleave:鼠标在元素上移开时触发 mouseleave 事件。...:mouseover和mouseenter的异同体现在两个方面:是否支持冒泡事件的触发时机可见mouseover事件因其具有冒泡的性质,在子元素内移动的时候,频繁被触发,如果我们不希望如此,可以使用mouseenter
方法一:$ele.mousedown() mousedown 无参,只是绑定一个事件,在函数里可以实现其他的绑定事件 方法二:$ele.mousedown(handler(eventObject)) mousedown...强调按下,keyup强调松开;如果点击按住不放并离开元素,还是会实现所绑定的事件;理论上可以绑定所有元素,一般用于表单元素。...13、jQuery键盘事件之keypress()事件 keydown事件触发在文字还没敲进文本框,这时如果在keydown事件中输出文本框中的文本得到的是触发键盘事件前的文本,而keyup事件触发时整个键盘事件的操作已经完成...").on("click","p",fn) 注:事件绑定在最上层div元素上,当用户触发在a元素上,事件将往上冒泡,一直会冒泡在div元素上。...;如果时fadeIn(options)时一开始布局变化,然后逐渐改变透明度 options可以传递多个参数,可以字典的形式传递,具体属性及属性值可查阅官方文档。
注意事项: 你不能依靠DOMContentLoaded或内jQuery.ready()来触发代码(相反可以使用文章事件和脚本的重新加载中的方法)。...第三方脚本,想要兼容InstantClick可能需要一些调整(看文章下面:事件和脚本的重新加载) 在页面变化上浏览器不会显示加载痕迹(看下文的自定义进度条)....', true); 5,事件和脚本的重新加载 InstantClick技术让你的网站成为一个单页面应用程序,所以没有DOMContentLoaded开始页面内的变化了。...InstantClick 4个事件提供钩子为页面的生命周期: change:页面更改完毕,即click触发 fetch:页面开始预加载 receive:页面预加载完毕,即:hover或mousedown...wait:用户点击一个链接,但是还没有加载的页面。只有立即触发页面时不显示。
() 鼠标按下和松开事件 5 mouseover()/mouseout() 鼠标移入和移出事件 6 mouseenter()/mouseleave() 鼠标移入移出事件 //mouseover...()/mouseout()和mouseenter()/mouseleave()的区别 首先来了解一下事件冒泡和捕获 事件冒泡:内部事件先触发,然后在触发外部事件 事件捕获:外部事件先被触发...有两个参数(方法),鼠标一定到指定对象以及移出时会触发 二 键盘事件 1 keydown 键盘按下时触发的事件 2 keyup 键盘松开一瞬间触发的事件 3 keypress... 键盘按下松开整个过程触发的事件 //keydown()和keypress区别 keydown()按下任意键都会触发,但keypress()事件只在按下键盘中任意字符键(A-Z)时触发,功能键不会触发...()和focusin() 的区别 focusin可以在父元素上检测子元素获得焦点的情况 而focusout可以在父元素上检测子元素失去焦点情况 四 其他事件 1 scroll()滚动滚动条时触发的事件
监听全局的错误提示,然后统计汇总,比如fundebug,也可以自己根据特性写一个针对公司项目的。...scroll 滚动的时候触发,无限滚动之类的一些效果 resize 放大缩小窗口的时候发生变化,和上面的scroll都需要注意去抖, 鼠标事件 传送门,去看鼠标事件 click 单击事件,在DOM上单击鼠标时候触发...mousedown和mouseup 鼠标按下和弹起,使用频率不是很高。可以做一下拖动之类的效果。...mouseout和mouseover 鼠标移出和移入,使用起来会有冒泡的问题,可以使用延时的方法解决 mouseleave和mouseenter 鼠标移除和移除,解决了冒泡的问题。...在文本插入文本框之前会触发textInput事件。 compositionstart 在IME的文本复合系统打开时触发,表示要开始输入了。
删除冒泡 click 点击事件 change 内容发生改变,并失焦后才触发该事件 contextmenu 右击事件 clientX 光标相对于该网页的水平位置 clientY 光标相对于该网页的垂直位置...elastic 指数衰减的正弦曲线缓动 error 错误 过失 element 元素 else 否则 F: focus 当输入框聚焦的时候触发 firstChild 第一个子节点 firstElementChild...鼠标指针经过时的效果,或称为“悬停状态” I: input 当输入的时候实时触发 innerHeight 内部高度 innerWidth 内部宽度 in 从0开始加速的缓动 inOut 前半段从0开始加速...移动到元素上 mouseout 从元素上移开 mousemove 移动鼠标 mousewheel 在其他浏览器的滚轮事件 mousedown 鼠标按下事件 mouseup 鼠标抬起事件 margin...在改变时 onfocus 在获得焦点时 onblur 在失去焦点时 onscroll 窗口滚动事件 onresize 窗口大小监听事件 out 减速到0的缓动 onStart 开始事件 onComplete
当监听鼠标事件时,会触发一些事件,我们可以与之交互: mousedown 按下鼠标按钮触发 mouseup 鼠标按钮被释放 click 点击事件 dblclick 双击事件 mousemove 当鼠标移动到元素上时...,鼠标移动 mouseover 当鼠标移动到一个元素或它的一个子元素上时,鼠标悬停。...mouseenter 当鼠标移动到一个元素上时,鼠标进入。类似于mouseover但不冒泡。 mouseout 当鼠标移出元素时,以及当鼠标进入子元素时。...当您跟踪一个单击事件时,就像跟踪一个mousedown跟着一个mouseup事件一样。在dblclick的情况下,还会触发两次click。...mousedown、mousemove和mouseup可以结合使用来跟踪拖放事件。 小心使用mousemove,因为它在鼠标移动时多次触发。我们需要应用节流,这是我们在分析滚动时会详细讨论的东西。
只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件。请看下面例子的演示。 6.mouseover 当鼠标指针位于元素上方时,会发生 mouseover 事件。...只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。请看下面例子的演示。 7.mouseup 当在元素上放松鼠标按钮时,会发生 mouseup 事件。...三:input事件 1.获得焦点focus :当元素获得焦点时,触发 focus 事件。可以通过鼠标点击或者键盘上的TAB导航触发。...blur事件会在元素失去焦点的时候触发,既可以是鼠标行为,也可以是按tab键离开的 3.内容改变change :当元素的值发生改变时,会发生 change 事件。...可以通过在某个绑定的函数中返回false来防止触发浏览器的默认行为。 四:其他事件: 1.scroll 当用户滚动指定的元素时,会发生 scroll 事件。
singleTap 和doubleTap分别代表单次点击和双次点击 二:tap的穿透处理 使用zepto框架的tap的点击事件,来规避click事件的延迟响应,会出现穿透,即点击会触发非当前层的点击事件...三:穿透原因 问题:在HTML5点击了q以后,弹出b的弹框 因为tap事件是通过document绑定了touchstart和touchend事件实现,$('.q')上,当touchend事件冒泡到document...也可以不在body上初始化它,而在某个dom上初始化,这样,只有设个dom和它的子元素才能享受"无延迟"的点击 实践开发中,当元素绑定fastclick后,click响应速度比tap还要快一点。...2.为元素绑定touchend事件,并在内部加上e.preventDefault(); $demo.on('touchend',function(e){ //改变了事件名称,tap是body上才被触发,...touchend事件可以类比于mousedown mouseover mouseup的触发
最后一个阶段是冒泡阶段,可以在这个阶段对事件做出响应。 事件处理程序 ---- 事件就是用户或浏览器自身执行的某种动作。如 click、load 和 mouseover,都是事件的名字。...因为用户可能会在 HTML 元素一出现在页面上就触发相应的事件,但当时的事件处理程序有可能尚不具备执行条件 其次,扩展事件处理程序的作用域链在不同浏览器中会导致不同结果 最后,HTML 与 JavaScript...事件对象 ---- 在触发 DOM 上的某个事件时,会产生一个事件对象 event,这个对象中包含着所有与事件有关的信息。...JavaScript 错误时在 window 上面触发,当无法加载图像时在 img 元素上面触发 scroll: 当用户滚动带滚动条的元素中的内容时,在该元素上面触发 resize: 当窗口或框架的大小变化时在...mouseover: 在鼠标指针位于一个元素外部,然后用户将其首次移入另一个元素边界之内时触发 注意: 只有在同一个元素上相继触发 mousedown 和 mouseup 事件,才会触发 click
第 3 步:使用断点暂停代码 如果退一步思考应用的运作方式,您可以根据经验推测出,使用与 Add Number 1 and Number 2 按钮关联的 click 事件侦听器时计算的和不正确 (5+1...DevTools 会显示 click 和 mousedown等鼠标事件列表。 每个事件旁都有一个复选框。 勾选 click 复选框。...事件侦听器 在触发 click 等事件后运行的代码中。 异常 在引发已捕获或未捕获异常的代码行中。 函数 任何时候调用特定函数时。 代码行断点 在知道需要调查的确切代码区域时,可以使用代码行断点。...事件侦听器断点 如果想要暂停触发事件后运行的事件侦听器代码,可以使用事件侦听器断点。 您可以选择 click 等特定事件或所有鼠标事件等事件类别。 点击 Sources 标签。...然后再次触发,选择跳过断点。就可以使得元素出现。 ? Mouse outer 如果是通过 mouse (鼠标事件来触发的)并且触发元素是写在触发元素外的情况。可以通过断点触发来阻断。
如果想从头学起Cypress,可以看下面的系列文章哦 https://www.cnblogs.com/poloyy/category/1768839.html .trigger() 在DOM元素上触发指定事件...mousedown 事件 cy.get('a').trigger('mousedown') 错误用法 // 不能直接通过 cy 调用 cy.trigger('mousedown') // location...并不是 DOM 元素 cy.location().trigger('mousedown') 鼠标事件的栗子 前言 在 DOM 元素上触发事件之前,DOM 元素必须处于【可交互】状态(必须可见并 且不能禁用...添加 options 的栗子 指定事件不应该冒泡 cy.get('#s-usersetting-top').trigger('mouseover', {bubbles: false}) 默认情况下,指定的事件将在...false 可以防止事件冒泡 设置 clientX 和 clientY 这将覆盖基于元素本身的默认自动定位(x、y),对于 mousemove 之类的事件很有用,可能需要将元素拖动到元素本身之外的地方
MouseEvent的类别有以下: mousedown 鼠标按下 mouseup 鼠标释放 click 左键单击 dblclick 左键双击 mousemove 鼠标移动 mouseover 鼠标经过...区别:mouseover和mouseout子元素也会触发,可以冒泡触发 区别:mouseenter和mouseleave是针对侦听的对象触发,阻止了冒泡 阻止鼠标的默认事件 e.preventDefault...左键对应的值为 0、1、1 中键对应的值为 1、4、2 右键对应的值为 2、2、3 timeStamp 从页面打开开始到触发事件的时间 以下内容为坐标值的说明: clientX和clientY与x...,y clientX和clientY与x,y一样的,都是客户区域坐标,指鼠标的坐标,以浏览器显示区域的左上角开始,x,y是新浏览器支持 以下截图打印的结果都是div2元素的左上顶点(从边框开始)的位置坐标...相对页面左上角的距离 screenX screenY screenX screenY 相对屏幕左上角的位置 总结: clientX和clientY与x,y一样的,以浏览器显示区域的左上角开始
节点名.addEventListener('事件名', function () {}); 利用此方法可以获取节点上发生的事件,并在之后的function中对事件做出反应。...: 点击事件 dblclick: 双击事件 mousedown: 在元素上按下任意鼠标按钮。...mouseenter: 指针移到有事件监听的元素内。 mouseleave: 指针移出元素范围外(不冒泡)。 mousemove: 指针在元素内移动时持续触发。...mouseover: 指针移到有事件监听的元素或者它的子元素内。 mouseout: 指针移出元素,或者移到它的子元素上。 mouseup: 在元素上释放任意鼠标按键。...操作中更改样式属性的方法,来实现动态化 事件冒泡 在JavaScript有一种情况,当你同时在父亲节点和子节点同时设置监听事件,当你触发了子节点的监听事件,父节点的事件也会被触发,这种现象叫做事件冒泡。
,则在object上面触发;error事件,当发生JavaScript脚本错误时触发,当无法加载图像时,在img元素上触发,当无法加载嵌入内容时在object上触发,当框架无法加载时触发;select事件...使用load事件能够确保事件是在页面元素加载完成后触发,不活出现错误。如果我们在页面元素位加载完成,就去获取页面上的元素,则会产生错误。...焦点事件 焦点事件会在页面获得或失去焦点时触发。利用这些事件,并于document.hasFocus()方法和document.activeElement属性配合,可以知晓用户在页面上的行为。...;mouseover事件,鼠标位于元素外部,然后用户首次将其移入元素内部触发;mouseup事件,释放鼠标时触发。 ...只有在同一个元素上触发mousedown和mouseup事件,才会触发click事件。只有触发两次click事件,才会触发dbclick事件。
事件处理程序 事件处理程序是这种命令,当特定的事件触发时,它告诉某些代码运行。...因此,我们代码将使得事件处理程序在现代浏览器和IE8种可工作 作为一方面的说明。这是一种使用一个强大JavaScript库的原因,比方jQuery。...正由于它是一个mousemove侦听器,当鼠标每次在舞台区域内移动时,都将触发它(这意味着在一秒钟内将会触发多次)这个函数须要将机器人的位置和鼠标的位置作比較。并使机器人见机行事。...} 我们有个叫做e的參数在函数中,虽然我们没有传递不论什么东西给它。可是这是一个事件侦听器,我们将自己主动拥有一个叫做e的变量,这个变量存储有和事件相关的信息,比方鼠标数据。...我们仍须要向前进一步,使得我们的机器人能够在不论什么设备上跑动。由于触摸屏表现得有些不同,我们须要在事件侦听器上做一些额外的编码。
事件 事件类型非常多,常用的有: /** 定义 mousedown 事件对象的 type 属性值。...*/ static MOUSE_MOVE: string; /** 定义 mouseover 事件对象的 type 属性值。...事件绑定: /** * 增加事件侦听器,以使侦听器能够接收事件通知。...: Array): EventDispatcher; /** * 增加事件侦听器,以使侦听器能够接收事件通知,此侦听事件响应一次后则自动移除侦听。...: Array): EventDispatcher; 注意:多次为同一个节点使用on方法会多次绑定事件,需要了解的是,如果对节点的操作不会有变化,则使用on方法绑定一次即可,如果根据状态条件等因素的不同
“此对象”表示被添加了这个事件的对象 与jquery和js一致,事件的回调函数第一个参数会带上事件对象,在easeljs文档event类中可以看到各个事件属性的说明。...click 继承自 DisplayObject 加入版本 0.6.0 在用户按下左键并在此对象上松开左键后触发。...mousedown事件后,松开鼠标会触发。...这事件在拖拽和类似的需求里很有用。 removed 继承自 DisplayObject 当此对象从它的父对象上移除后会触发。...rollover 继承自 DisplayObject 加入版本 0.7.0 这个事件和mouseover很像,不同之处跟rollout和mouseout的不同之处是一样的。
领取专属 10元无门槛券
手把手带您无忧上云