首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

jquery 事件冒泡、阻止事件冒泡 - event.stopPropagation()

可以编写一个偏移问题的div来看看,如下: ? 好了,现在黄色的div已经跟两个父级的元素位置不重叠了。再次点击看看,如下: ? ? ?...事件冒泡机制有时候是不需要的,需要阻止掉,通过 event.stopPropagation() 来阻止 阻止上面点击黄色div的click()冒泡传递 ?...阻止默认行为 阻止表单提交 $('#form1').submit(function(event){ event.preventDefault(); }) 这个是阻止表单提交的默认行为,这个行为和阻止冒泡可以合并一起写...合并阻止操作 实际开发中,一般把阻止冒泡和阻止默认行为合并起来写,合并写法可以用 // event.stopPropagation(); // event.preventDefault(); // 合并写法...使用return false;其实就是使函数传递false的值,从而阻止冒泡传递,阻止函数继续执行。

5.5K41

JS事件冒泡及阻止

事件冒泡及阻止 当一个元素接收到事件的时候,会把他接收到的事件传给自己的父级,一直到window,当然其传播的是事件,绑定的执行函数并不会传播,如果父级没有绑定事件函数,就算传递了事件,也不会有什么表现...DOCTYPE html> JS事件冒泡及阻止 div{...DOCTYPE html> JS事件冒泡及阻止 li{...有时候我们并不希望事件冒泡而去执行上级节点绑定的事件,这时候就需要阻止事件的冒泡,w3c的方法是e.stopPropagation(),IE则是使用 window.event.cancelBubble...阻止冒泡并不能阻止对象默认行为,例如submit按钮被点击后会提交表单数据,需使用e.preventDefault();阻止默认行为,IE则是window.event.returnValue = false

6.5K20

jsevent loop

JsEvent Loop js单线程 ​ 总所周知,JavaScript是单线程的,也就是说同一时间只能做一件事,那为什么JavaScript不能是多线程的呢,这跟它的用途有关,作为浏览器脚本语言...因此为了避免这种问题,js必须是一门单线程的语言! 任务队列 ​ 所有任务可以分成两种,一种是同步任务(synchronous),另一种是异步任务(asynchronous)。...为了更好地理解Event Loop,请看下图(转引自Philip Roberts的演讲《Help, I'm stuck in an event-loop》) 案例 案例1 console.log(111...由于之前的操作很快,还没到1000毫秒就已经执行完了,这时宏任务还是会会继续等到了1000毫秒(即18:30:02秒),才打印444。...此时 microtask 的任务有 t2 和 t1 script 任务继续运行,输出 3。至此,第一个宏任务执行完成。

92220

Event Loop(node.js)

所以 Node.js 的执行可以简单地分成两个阶段: 初始化代码执行 事件循环 初始化代码执行里,执行所有的同步操作代码。所谓同步操作,就是永远一步步执行、没有结果不继续执行后面代码的操作。...对应的异步操作是不等待结果就继续执行后面代码的操作。一般异步操作都带有一个回调函数,而回调函数里的操作不包括在上面说的「后面代码」里,而是异步操作完成以后希望要执行的操作,它们需要排队等待被执行。...Node.js 异步操作的执行 我们知道 Node.js 的所有异步操作都是由 Libuv 来负责的。...下图列出了一些异步操作一般由谁来执行:(图来自:Morning Keynote- Everything You Need to Know About Node.js Event Loop - Bert...; }); 用了 process.nextTick() : const EventEmitter = require('events'); const util = require('util');

79020

js中的事件(event

//标准浏览器中:定义一个形参e,但当事件触发的时候,并没有给e赋实际的值,则浏览器会把”事件“的对象赋给这个形参e,这时这个e是个系统级的对象:事件; IE中的事件对象是个全局的属性window.event...,而标准浏览器的事件对象就是形参e; 所以事件对象的兼容性写法为:e = e||window.event; 以下是常用的事件对象的属性: var x =e.clientX,y=e.clientY;所有浏览器都支持...onmousemove这个属性 示例2: var ele = document.getElememtById('div1'); document.onkeydown = function(e){ e=e||wondow.event...当你在网页上点击鼠标右键的时候会出现一个右键菜单;当你在一个form表单里点击提交按钮时网页会产生一个行为病刷新网页,当你网页上滚动鼠标滚轮的时候,页面的滚动条会滚动等等;这些都叫事件的默认行为,如果想把这些默认行为取消了,相应的js...上;这样,只需要在document上处理click事件即可; document.onclick = function(e){ e = e||window.event; var target = e.target

6.6K30

js Event Loop 运行机制

Event Loop,事件环,线程进程。这些概念对初识前端的同学来说可能会一头雾水。而且运行js代码的运行环境除了浏览器还有node。因此不同环境处理Event Loop又变得不同,十分容易混淆。...js渲染引擎的Event Loop 以上线程,每个拿出来都可以详细的说上一篇。Event Loop涉及到的JS引擎的一些运行机制的分析。...先执行栈中的任务,执行完毕,检查队列是否为空,不为空,将队列中的任务压入执行栈中执行。直到栈和队列均为空。 js渲染引擎的Event Loop如下图 ?...否则继续检查定时器队列。...执行时间队列里第一个宏任务时timeout1,遇到微任务promise,放到微任务队列中 此时时间队列还未清空,继续执行完成所有时间队列里的任务。

1.7K40

vue.js中实现阻止事件冒泡

当父子元素中都有点击事件的时候,为了让触发子元素中的事件时,不去触发父元素中的事件,可以在子元素事件中添加stop来阻止事件冒泡。....stop 是阻止冒泡行为,不让当前元素的事件继续往外触发,如阻止点击div内部事件,触发div事件 .prevent 是阻止事件本身行为,如阻止超链接的点击跳转,form表单的点击提交 .self 是只有是自己触发的自己才会执行...,如果接受到内部的冒泡事件传递信号触发,会忽略掉这个信号 .capture 是改变js默认的事件机制,默认是冒泡,capture功能是将冒泡改为倾听模式 .once 是将事件设置为只执行一次,如 .click.prevent.once...阻止click事件冒泡(防止触发另一个事件)的方法 使用vue阻止子级元素的click事件冒泡。...方法二 可以自己写个阻止冒泡事件 然后在发生冒泡的元素中调用这个事件 @click="_stopPropagation($event)" methods:{ _stopPropagation

6K10
领券