zoukankan      html  css  js  c++  java
  • 阻止事件流冒泡

    今天又有个朋友问我“点击某个按钮触发某个事件,点击这个按钮之外的任何一个地方触发另一个事件”的功能怎么写。其实有两个方法。一种是在按钮上加个事件,document上加另一个事件,但是在按钮的事件最后,加上阻止事件流冒泡的语句,不冒到document上就行。另一种方法,就是在document上监听事件,然后通过对event.target进行判断,如果当前元素是按钮,执行某个事件,如果不是,执行另一事件。我自己习惯性用第一种方法,放上一个简单的例子吧。

    ========================================
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>阿当制作</title>
    </head>

    <body>
    <input type="button" value="不阻止冒泡的按钮" id="btn" />
    <input type="button" value="阻止冒泡的按钮" id="btn2" />
    </body>
    <script type="text/javascript">
        document.onclick = function(){
            alert("我是body");
        }
        document.getElementById("btn").onclick=function(e){
            alert("我是按钮");
        }
        document.getElementById("btn2").onclick=function(e){
            alert("我是按钮");
            if(document.all) window.event.cancelBubble=true;
            else e.stopPropagation();
        }   
    </script>
    </html>
  • 相关阅读:
    7-1 词频统计 (30 分)
    VS Code 配置 Python 开发环境
    7-6 求指定层的元素个数 (40 分)
    7-5 列表元素个数的加权和(1) (40 分)
    Oracle中的数据库、用户、方案、表空间、表对象之间的关系
    Oracle归档模式和非归档模式
    Oracle中的单引号和双引号
    PL/SQL编程中的问题
    Oracle数据库语言分类
    Oracle中的delete、truncate和drop
  • 原文地址:https://www.cnblogs.com/cly84920/p/4427010.html
Copyright © 2011-2022 走看看