return、reutrn false、e.preventDefault、e.stopPropagation、e.stopImmediatePropagation的区别

return

var i = function(){

return

}

console.log(i())//undefined

return的主要作用是阻止函数继续执行，直接返回undefined

return false

$('.baidu').on('click',function(e){

console.log(1)

return false

})//1

并未跳转页面，当每次调用return false时，实际做了3件事情

1.event.preventDefault()；

2.event.stopPropagation();

3.停止回调函数执行并立即返回

e.preventDefault

$('.baidu').on('click',function(e){

console.log(1)

e.preventDefault()

})//1

e.preventDefault()方法用来阻止浏览器继续执行默认行为，这里阻止了页面的跳转

e.stopPropagation

$('.btn').on('click', function () {

console.log(520)

})

$('.btn .baidu').on('click', function (e) {

console.log(1)

e.preventDefault()

e.stopPropagation()

})

输出结果为1

e.stopPropagation阻止事件冒泡

e.stopImmediatePropagation

$('.btn .baidu').on('click',function(e){

console.log(1)

e.preventDefault()

})

$('.btn .baidu').on('click',function(e){

console.log(2)

e.preventDefault()

e.stopImmediatePropagation()

})

$('.btn .baidu').on('click',function(e){

e.preventDefault()

console.log(3)

})

$('.btn').on('click',function(e){

e.preventDefault()

console.log(4)

})

点击输出结果为1,2

e.stopImmediatePropagation()会停止一个事件继续执行，即使当前的对象上还绑定了其他处理函数，所有绑定在一个对象上的事件会按照绑定顺序执行

综上所述

return阻止函数继续执行，返回undefined

return false有三个作用，阻止浏览器默认行为，阻止事件冒泡，停止回调函数执行并立即返回

event.preventDefault阻止浏览器默认行为

event.stopPropagation阻止事件冒泡

event.stopImmediatePropagation停止一个事件继续执行，即使当前的对象上还绑定了其他处理函数，所有绑定在一个对象上的事件会按照绑定顺序执行

转载于:https://www.cnblogs.com/ranyonsue/p/10869819.html

return、reutrn false、e.preventDefault、e.stopPropagation、e.stopImmediatePropagation的区别相关推荐

原生JS事件中，return false 和 preventDefault() 的区别
前几天有同学问我,如果在页面上禁止右键.一听到这个,我的第一个想法就是右键弹出来的菜单应该是浏览器的默认事件,是不是可以根据按键的类型来判断是点击了右键,然后静止默认事件来做. document.ad ...
js中的preventDefault与stopPropagation详解
1. preventDefault: 比如<a href="http://www.baidu.com">百度</a>,这是html中最基础的东西,起的作用就 ...
js中的preventDefault与stopPropagation详解（转）
先讲解一下js中preventDefault和stopPropagation两个方法的区别: preventDefault方法的起什么作用呢?我们知道比如<a href="http:/ ...
深入了解preventDefault与stopPropagation
event.preventDefault()用法介绍(阻止默认事件) 该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作).例如,如果 type 属性是 "subm ...
preventDefault与stopPropagation的作用
如题,本篇文章讨论preventDefault和stopPropagation二者的作用,首先,先理解一下二者的字面意思: 一.preventDefault,prevent是动词,意为"防止 ...
前端知识点（1）——preventDefault和stopPropagation
[preventDefault] (1)在表单中,点击"提交",即可提交表单,如果我们想要阻止这种表单的默认行为,即可使用preventDefault (2)a标签等的点击链接,点 ...
stopPropagation和cancelBubble的区别
首先,总结一下DOM中的事件对象:(符合W3C标准) preventDefault() 取消事件默认行为 stopImmediatePropagation() 取消事件冒泡同时阻止当前节点 ...
js中preventDefault、stopPropagation、return false三者之间
2019独角兽企业重金招聘Python工程师标准>>> preventDefault: preventDefault它是事件对象(Event)的一个方法,作用是取消一个目标元素的默认 ...
js-forEach 不能使用break continue return true false
需要按照以下的方法应用! try { var array = ["first","second","third","fou ...

return、reutrn false、e.preventDefault、e.stopPropagation、e.stopImmediatePropagation的区别

return、reutrn false、e.preventDefault、e.stopPropagation、e.stopImmediatePropagation的区别相关推荐

最新文章

热门文章