JavaScript中点击事件的写法


Posted in Javascript onJune 28, 2016
<button id="btn">click</button>
var btn=document.getElementById('btn');

第一种:

btn.onclick=function(){
alert('hello world');
}

消除事件:btn.onclick=null;//就不会弹出框了

第二种:

btn.addEventListener('click',function(){alert('hello world')},false);
btn.addEventListener('click',function(){alert(this.id)},false);

第三种:

function demo(){

alert('hello');
}
<button id="btn" onclick="demo()">click</button>

下面给大家介绍js触发按钮点击事件

模拟JS触发按钮点击功能

<html> 
  <head> 
    <title>usually function</title> 
  </head> 
  <script> 
function load(){ 
  //下面两种方法效果是一样的 
  document.getElementById("target").onclick(); 
  document.getElementById("target").click(); 
} 
function test(){ 
  alert("test"); 
} 
</script> 
  <body onload="load()"> 
    <button id="target" onclick="test()">test</button> 
  </body> 
<html>

 备注:

btnObj.click()是真正地用程序去点击按钮,触发了按钮的onclick()事件

btnObj.onclick()只是简单地调用了btnObj的onclick所指向的方法,只是调用方法而已,并未触发事件

Javascript 相关文章推荐
Aptana调试javascript图解教程
Nov 30 Javascript
一些经常会用到的Javascript检测函数
May 31 Javascript
Js+Flash实现访问剪切板操作
Nov 20 Javascript
jstl中判断list中是否包含某个值的简单方法
Oct 14 Javascript
JS中正则表达式全局匹配模式 /g用法详解
Apr 01 Javascript
javascript  数组排序与对象排序的实例
Jul 17 Javascript
JS使用tofixed与round处理数据四舍五入的区别
Oct 25 Javascript
vue实现提示保存后退出的方法
Mar 15 Javascript
Angular5中状态管理的实现
Sep 03 Javascript
JavaScript常用数组操作方法,包含ES6方法
May 10 Javascript
如何使用CSS3+JQuery实现悬浮墙式菜单
Jun 18 jQuery
Vue 3.0 前瞻Vue Function API新特性体验
Aug 12 Javascript
js改变style样式和css样式的简单实例
Jun 28 #Javascript
js改变css样式的三种方法推荐
Jun 28 #Javascript
Javascript中获取浏览器类型和操作系统版本等客户端信息常用代码
Jun 28 #Javascript
获取input标签的所有属性的方法
Jun 28 #Javascript
JavaScript ES6的新特性使用新方法定义Class
Jun 28 #Javascript
javascript 常用验证函数总结
Jun 28 #Javascript
JS传递对象数组为参数给后端,后端获取的实例代码
Jun 28 #Javascript
You might like
几种有用的变型 PHP中循环语句的用法介绍
2012/01/30 PHP
PHP hex2bin()函数用法讲解
2019/02/25 PHP
PHP析构函数destruct与垃圾回收机制的讲解
2019/03/22 PHP
Yii2.0框架模型添加/修改/删除数据操作示例
2019/07/18 PHP
Laravel5.1 框架表单验证操作实例详解
2020/01/07 PHP
laravel框架使用极光推送消息操作示例
2020/02/15 PHP
原生javascript图片自动或手动切换示例附演示源码
2013/09/04 Javascript
使用JavaScript获取电池状态的方法
2014/05/03 Javascript
jQery使网页在显示器上居中显示适用于任何分辨率
2014/06/09 Javascript
js网页滚动条滚动事件实例分析
2015/05/05 Javascript
如何解决谷歌浏览器下jquery无法获取图片的尺寸
2015/09/10 Javascript
Vue.js基础知识小结
2017/01/13 Javascript
原生JS和jQuery操作DOM对比总结
2017/01/19 Javascript
Vue渲染函数详解
2017/09/15 Javascript
5 种JavaScript编码规范
2018/01/30 Javascript
Python Tkinter基础控件用法
2014/09/03 Python
对Python新手编程过程中如何规避一些常见问题的建议
2015/04/01 Python
Python的函数的一些高阶特性
2015/04/27 Python
python3转换code128条形码的方法
2019/04/17 Python
python basemap 画出经纬度并标定的实例
2019/07/09 Python
在python Numpy中求向量和矩阵的范数实例
2019/08/26 Python
Python关键字及可变参数*args,**kw原理解析
2020/04/04 Python
Django实现后台上传并显示图片功能
2020/05/29 Python
什么是python的id函数
2020/06/11 Python
使用 css3 实现圆形进度条的示例
2017/07/05 HTML / CSS
彪马加拿大官网:PUMA加拿大
2018/10/04 全球购物
State Cashmere官网:半零售价可持续蒙古羊绒
2020/02/26 全球购物
大学生职业规划论文
2014/01/11 职场文书
岗位职责的构建方法
2014/02/01 职场文书
会议室标语
2014/06/21 职场文书
过程装备与控制工程专业求职信
2014/07/02 职场文书
尼克胡哲观后感
2015/06/08 职场文书
nginx前后端同域名配置的方法实现
2021/03/31 Servers
Python中使用Lambda函数的5种用法
2021/04/01 Python
CSS Transition通过改变Height实现展开收起元素
2021/08/07 HTML / CSS
numpy array找出符合条件的数并赋值的示例代码
2022/06/01 Python