event.preventDefault() --- event.stopPropagation()

1、event.preventDefault()   阻止默认行为

<a href="http://www.baidu.com">链接</a>
// 阻止默认行为  e.preventDefault();
            $("a").click(function(){
                event.preventDefault();
            })

            //阻止浏览器的默认行为
            function stopDefault( e ) {
                //阻止默认浏览器动作(W3C)
                if ( e && e.preventDefault )
                    e.preventDefault();
                //IE中阻止函数器默认动作的方式
                else
                    window.event.returnValue = false;
                return false;
            }

2、event.stopPropagation()  停止冒泡

<div class="demo" onclick="alert(‘div‘)">
        <ul onclick="alert(‘ul‘)">
            <li onclick="alert(‘li‘)">asd</li>
        </ul>
    </div>
// 防止冒泡  e.stopPropagation(e);
            $(".demo li").click(function(e){
                window.event ? window.event.cancelBubble = true : e.stopPropagation();
            })

            function stopBubble(e) {

                //如果提供了事件对象,则这是一个非IE浏览器
                if ( e && e.stopPropagation )
                    //因此它支持W3C的stopPropagation()方法
                    e.stopPropagation();
                else
                    //否则,我们需要使用IE的方式来取消事件冒泡
                    window.event.cancelBubble = true;
                }
            }
时间: 2024-11-03 21:05:46

event.preventDefault() --- event.stopPropagation()的相关文章

jQuery事件--- event.preventDefault() 取消点击动作的默认导航行为

event.preventDefault() 描述: 如果调用这个方法,默认事件行为将不再触发. event.preventDefault()   //这个方法不接受任何参数. 例如,在执行这个方法后,如果点击一个链接(a标签),浏览器不会跳转到新的 URL 去了.我们可以用 event.isDefaultPrevented() 来确定这个方法是否(在那个事件对象上)被调用过了. 帮助文档:http://www.w3school.com.cn/jquery/jquery_ref_events.a

js事件之event.preventDefault()与(www.111cn.net)event.stopPropagation()用法区别

event.preventDefault()用法介绍 该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作).例如,如果 type 属性是 "submit",在事件传播的任意阶段可以调用任意的事件句柄,通过调用该方法,可以阻止提交表单.注意,如果 Event 对象的 cancelable 属性是 fasle,那么就没有默认动作,或者不能阻止默认动作.无论哪种情况,调用该方法都没有作用. 该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作

event.stopPropagation()与event.preventDefault()

<div id='div0'> <div id='div1'> <a href="#" id='div2'>2222</a> </div> </div> window.onload=function(){ var div0=document.getElementById('div0'); var div1=document.getElementById('div1'); var div2=document.getE

JQuery中event的preventDefault和stopPropagation介绍

event.preventDefault()阻止默认事件行为的触发. event.stopPropagation()防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数. 1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="

关于js中return false、event.preventDefault()和event.stopPropagation()

在平时项目中,如果遇到需要阻止浏览器默认行为,大家经常会用return false;和event.preventDefault()来阻止,但对它俩的区别还是有些一知半解,于是看了文档,查了些资料,在此总结下它俩的区别,顺便带上event.stopPropagation()一起区分下. 一.原生js中: 关于return false和preventDefault: 在W3C Document Object Model Events Specification1.3版本中提到过: The Event

js事件之event.preventDefault()与event.stopPropagation()用法区别

event.preventDefault()用法介绍 该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作).例如,如果 type 属性是 "submit",在事件传播的任意阶段可以调用任意的事件句柄,通过调用该方法,可以阻止提交表单.注意,如果 Event 对象的 cancelable 属性是 fasle,那么就没有默认动作,或者不能阻止默认动作.无论哪种情况,调用该方法都没有作用. 该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作

阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别

今天来看看前端的冒泡和事件默认事件如何处理 1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, 2.event.preventDefault()方法 这是阻止默认事件的方法,调用此方法是,连接不会被打开,但是会发生冒泡,冒泡会传递到上一层的父元素: 3.return false  : 这个方法比较暴力,他会同事阻止事件冒泡也会阻止默认事件:写上此代

JS 之 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别

在前端开发中,有时我们需要阻止冒泡和阻止默认事件的发生. 一.event.stopPropagation() 阻止事件的冒泡,不让事件向documen上蔓延,但是默认事件任然会执行,当调用这个方法的时候,如果点击一个连接,这个连接仍然会被打开. 二.event.preventDefault() 阻止默认事件的方法,调用此方法时,连接不会被打开,但是会发生冒泡,冒泡会传递到上一层的父元素: 三.return false: 这个方法比较暴力,会同时阻止事件冒泡也会阻止默认事件:写上此代码,连接不会被

Vue event.stopPropagation()和event.preventDefault()的使用

定义和用法 1. event.stopPropagation()方法 阻止事件冒泡到父元素,阻止任何父事件处理程序被执行,但是它的默认事件仍然会执行.当调用这个方法的时候,如果点击了一个链接(a标签),这个链接仍然会打开. 2. event.preventDefault()方法 阻止元素发生默认的行为.调用此方法链接(a标签)不会被打开,但是会冒泡到父元素上. 例如: (1). 当点击提交按钮时阻止对表单的提交 (2). 阻止 URL 的链接(意思是如果点击一个a标签,浏览器不会跳到新的 URL