阻止事件（取消其默认行为并阻止其传播）

最新推荐文章于 2025-02-17 20:34:54 发布

原创最新推荐文章于 2025-02-17 20:34:54 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#浏览器 #js #事件 #冒泡

javascript 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了如何在JavaScript中阻止事件的默认行为及其传播。提供了三种实用函数：完全取消事件的默认行为并阻止传播、仅阻止事件传播以及仅取消事件的默认行为。这些函数兼容不同浏览器环境。

取消浏览器对事件的默认行为（响应）（比如<a>标签的跳转等）并停止事件的继续传播。

实现代码

 
        function 
        stopEvent (evt) {
       
        var 
         evt = evt || window.event;
       
        if 
         (evt.preventDefault) {
       
        evt.preventDefault();
       
        evt.stopPropagation();
       
        } 
        else 
        {
       
        evt.returnValue = 
        false
        ;
       
        evt.cancelBubble = 
        true
        ;
       
        }
       
        }

只阻止事件继续传播（不取消默认行为）

 
        function 
        stopEvent (evt) {
       
        var 
         evt = evt || window.event;
       
        if 
         (evt.stopPropagation) {
       
        evt.stopPropagation();
       
        } 
        else 
        {
       
        evt.cancelBubble = 
        true
        ;
       
        }
       
        }

只取消默认行为（不阻止事件的继续传播）

 
        function 
        stopEvent (evt) {
       
        var 
         evt = evt || window.event;
       
        if 
         (evt.preventDefault) {
       
        evt.preventDefault();
       
        } 
        else 
        {
       
        evt.returnValue = 
        false
        ;
       
        }
       
        }