代码

$(function(){
$("#btn").click(function(){
console.log(2)
})
$("#btn").click(function(){
console.log(1)
})
$("#btn").click(function(){
console.log(3)
})
})
这个点击结果是输出2,1,3
因为你此处相当于绑定了click,在你没解绑之前,他依然具有第一个事件的,所以他会继续之前一个;
原生
document.getElementById("btn").addEventListener("click",function(){
console.log(10)
},false)
document.getElementById("btn").addEventListener("click",function(){
console.log(11)
},false)
document.getElementById("btn").addEventListener("click",function(){
console.log(12)},false);
而onclick:
是重新赋值,变量提升
document.getElementById("btn").onclick=function(){
console.log(1)
}
document.getElementById("btn").onclick=function(){
console.log(2)
}
document.getElementById("btn").onclick=function(){
console.log(3)
}
最终结果是3

关于onclick和addeventlistener('click'),click的整理的更多相关文章

  1. addEventListener的click和onclick的区别

    前两节都和addEventListener的click有关,于是在想它与onclick有什么区别呢,自己调试了一下,网上也有相关资料 事件绑定 onclick绑定方式 优点: - 简洁 - 处理事件的 ...

  2. js的onclick和jq的click以及on和bind的区别

    onclick和click,只能静态绑定点击事件:bind的可以一次绑定多个事件(click/onmouseover等):on可以动态的绑定事件,当页面加载完成调用on即可

  3. 注册事件处理程序onclick和addEventListener、attachEvent

    一.设置HTML标签属性为事件处理程序(注意和下面的设置javascript对象属性为事件处理程序是不同的) 用于设置文档元素事件处理程序属性也能化成对应的HTML标签的属性.如果这样做,属性值应该是 ...

  4. as3.0划线带撤销功能

    package com{ import flash.display.MovieClip; import flash.display.SimpleButton; import flash.events. ...

  5. as3.0 橡皮功能2

    package com{ import flash.display.MovieClip; import flash.display.Bitmap; import flash.display.Bitma ...

  6. [ActionScript 3.0] 如何获得实例对象的类名及类

    package { import flash.display.DisplayObject; import flash.display.MovieClip; import flash.display.S ...

  7. addEventListener、onclick和jquery的bind()、click()

    addEventListener("click",function(event){},false); removeEventListener("click",f ...

  8. js click 与 onclick 事件绑定,触发与解绑

    click 与 onclick 1.onclick 事件会在对象被点击时发生. <input id="btn1" type="button" onclic ...

  9. $("").click与onclick的区别

    onclick是绑定事件,click本身是方法作用是触发onclick事件,只要执行了元素的click()方法,下面示例 Html代码 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 ...

随机推荐

  1. webpack 优化代码 让代码加载速度更快

    一,如何优化webpack构建 (1),缩小文件搜索范围, 优化Loader配置 module.exports = { module: { rules: [ { test:/\.js$/, use:[ ...

  2. 使用EF Core的CodeFirt 出现的问题The specified framework version '2.1' could not be parsed

    今天使用了一下EF Core的Code First,进行数据库迁移的的时候报错了: The specified framework version '2.1' could not be parsed ...

  3. socketpair通信

    1.线程间通信(参考安卓源码InputTransport.cpp) #include <pthread.h> #include <sys/types.h> /* See NOT ...

  4. python3网络爬虫系统学习:第二讲 基本库requests(一)

    之前,我们学习了基本库urllib的相关用法,但是在网页验证.Cookies处理等方面是比较繁琐的,需要用到Handler并且还需自己构建Opener.requests库的出现很好的解决了这个问题,下 ...

  5. Python在线编程环境

    除了安装Python的IDE之外,也可以使用在网页中随时随地编写Python程序. Python官网:https://www.python.org/shell Python123:https://py ...

  6. 虚拟机搭建hadoop的步骤

    1.首先是安装Vmware Workstation,下载地址:https://www.vmware.com/products/workstation-player/workstation-player ...

  7. 给无符号数赋值负数(有符号数)的理解(unsigned\signedf)

    无符号数赋负数(有符号数)就类似于给字符型变量赋数值(char word=0x56),对相同的值不同的类型解析 //s16:signed short; u16:unsigned short s16 t ...

  8. 北京Uber优步司机奖励政策(4月8日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  9. create-react-app react-redux项目 配置模块热更新hmr

    HRM并不是create-react-app专属的,提供一篇博客介绍hrm http://chrisshepherd.me/posts/adding-hot-module-reloading-to-c ...

  10. 【白书训练指南】(UVa10755)Garbage Heap

    先po代码,之后把我那几个不太明了的知识点讲讲,巩固以下.三维的扫描线算法想要掌握还真是有一定的难度的. 代码 #include <iostream> #include <cstri ...