• JavaScript 点击事件的三种写法


    嵌入式

    <button οnclick='alert("hello")'>点击按钮</button>
    

    脚本模型

    btn.onclick=function(){}
    
    下面两种方法效果是一样的 
      document.getElementById("target").onclick(); 
      document.getElementById("target").click(); 
    
    备注:
    
    btnObj.click()是真正地用程序去点击按钮,触发了按钮的 onclick()事件
    
    btnObj.onclick()只是简单地调用了btnObj的onclick所指向的方法,只是调用方法而已,并未直接触发事件
    

    W3C事件写法

    添加事件:appEventListener(事件名,事件函数,false )
    btn.addEventListener('click',function(){},false);
    btn.addEventListener('click',function(){},false);
    移除事件:removeEventListener(事件名,事件函数名,false)
    btn.removeEventListener('click',show,false )
    第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。
    

    事件冒泡或事件捕获

    事件传递有两种方式:冒泡与捕获。

    事件传递定义了元素事件触发的顺序。 如果你将

    元素插入到

    元素中,用户点击

    元素, 哪个元素的 "click" 事件先被触发呢?

    • 在 冒泡 中,内部元素的事件会先被触发,然后再触发外部元素,即:

      元素的点击事件先触发,然后会触发

      元素的点击事件。

    • 在 捕获 中,外部元素的事件会先被触发,然后才会触发内部元素的事件,即:

      元素的点击事件先触发 ,然后再触发

      元素的点击事件。

        addEventListener(event, function, useCapture);
        默认值为 false, 即冒泡传递,当值为 true 时, 事件使用捕获传递。
    
  • 相关阅读:
    easyui struts后台实现tree返回json数据
    jquery扩展方法
    EasyUI tree扩展获取实心节点
    Hibernate之AbstractEntityPersister
    No CurrentSessionContext configured 异常解决
    Dubbo远程调用服务框架原理与示例
    mongodb高级操作及在Java企业级开发中的应用
    Java和MongoDB之Hello World
    Vmware 虚拟的Linux系统如何与宿主主机共享上网
    VM VirtualBox 上安装 CentOs6.4(详细)
  • 原文地址:https://www.cnblogs.com/loveer/p/11351815.html
Copyright © 2020-2023  润新知