Javascript中绑定click事件的四种方式介绍


Posted in Javascript onOctober 26, 2018

一:HTML中添加onclick

<button id="vv" onclick="myfunction()" >哈哈</button>

二:JS中定义函数绑定事件!

var funcc = function () {
  alert('我爱编程')
  }
var aa = document.getElementById('vv')
aa.onclick = funcc

三:直接定义函数与内容

document.getElementById('vv').onclick = function () {
  alert('hasssshhaa ')
  }

四:利用addEventListener

document.getElementById('vv').addEventListener('click',funcc);
//或者:
document.getElementById('vv').addEventListener('click',function () {
  alert('hahah')
  })

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Javascript 相关文章推荐
Mootools 1.2教程 正则表达式
Sep 15 Javascript
JavaScript 面向对象之命名空间
May 04 Javascript
深入分析js中的constructor和prototype
Apr 07 Javascript
jquery 触发a链接点击事件解决方案
May 02 Javascript
jqGrid随窗口大小变化自适应大小的示例代码
Dec 28 Javascript
基于jquery实现最简单的选项卡切换效果
May 08 Javascript
快速理解 JavaScript 中的 LHS 和 RHS 查询的用法
Aug 24 Javascript
Angular js 实现添加用户、修改密码、敏感字、下拉菜单的综合操作方法
Oct 24 Javascript
express如何使用session与cookie的方法
Jan 30 Javascript
使用typescript开发angular模块并发布npm包
Apr 19 Javascript
vue实现城市列表选择功能
Jul 16 Javascript
vue二选一tab栏切换新做法实现
Jan 19 Vue.js
使用webpack打包后的vue项目如何正确运行(express)
Oct 26 #Javascript
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
Oct 26 #jQuery
详解ES6 系列之异步处理实战
Oct 26 #Javascript
element-ui 的el-button组件中添加自定义颜色和图标的实现方法
Oct 26 #Javascript
angularjs通过过滤器返回超链接的方法
Oct 26 #Javascript
js使用formData实现批量上传
Mar 27 #Javascript
详解webpack打包时排除其中一个css、js文件或单独打包一个css、js文件(两种方法)
Oct 26 #Javascript
You might like
php数组函数序列之array_splice() - 在数组任意位置插入元素
2011/11/07 PHP
php获取指定(访客)IP所有信息(地址、邮政编码、国家、经纬度等)的方法
2015/07/06 PHP
PHP is_array() 检测变量是否是数组的实现方法
2016/06/13 PHP
php微信公众平台开发(一) 配置接口
2016/12/06 PHP
PHP pthreads v3下的Volatile简介与使用方法示例
2020/02/21 PHP
use jscript with List Proxy Server Information
2007/06/11 Javascript
基于Jquery的文字滚动跑马灯插件(一个页面多个滚动区)
2010/07/26 Javascript
jquery无缝向上滚动实现代码
2013/03/29 Javascript
基于JavaScript实现移除(删除)数组中指定元素
2016/01/04 Javascript
javascript截图 jQuery插件imgAreaSelect使用详解
2016/05/04 Javascript
深入分析javascript中console命令
2016/08/14 Javascript
javascript数字验证的实例代码(推荐)
2016/08/20 Javascript
Bootstrap Modal遮罩弹出层代码分享
2016/11/21 Javascript
iframe与主框架跨域相互访问实现方法
2017/09/14 Javascript
微信小程序 动画的简单实例
2017/10/12 Javascript
完美解决手机网页中输入框被输入法遮挡的问题
2017/12/19 Javascript
jquery实现下载图片功能
2019/07/18 jQuery
[54:25]Ti4 循环赛第三日LGD vs MOUZ
2014/07/12 DOTA
解析Python编程中的包结构
2015/10/25 Python
在unittest中使用 logging 模块记录测试数据的方法
2018/11/30 Python
对Python 检查文件名是否规范的实例详解
2019/06/10 Python
PyCharm搭建Spark开发环境实现第一个pyspark程序
2019/06/13 Python
Django Rest framework频率原理与限制
2019/07/26 Python
python异步编程 使用yield from过程解析
2019/09/25 Python
Django框架中间件定义与使用方法案例分析
2019/11/28 Python
Django 404、500页面全局配置知识点详解
2020/03/10 Python
python使用numpy中的size()函数实例用法详解
2021/01/29 Python
css 如何让背景图片拉伸填充避免重复显示
2013/07/11 HTML / CSS
办公室秘书自我鉴定
2014/01/18 职场文书
人事科岗位职责范本
2014/03/02 职场文书
2014年入党积极分子党课学习心得体会模板
2014/04/03 职场文书
教师批评与自我批评心得体会
2014/10/16 职场文书
民事调解书范文
2015/05/20 职场文书
2015年学校医务室工作总结
2015/07/20 职场文书
2016高中社会实践心得体会范文
2016/01/14 职场文书
如何正确理解python装饰器
2021/06/15 Python