JS模拟按钮点击功能的方法


Posted in Javascript onDecember 22, 2015

本文实例讲述了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模拟鼠标点击a便签的例子

这里先获取a标签元素,然后后面.click()即可.

代码如下:

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
<a href="这里是a标签的路径">这里是a标签的名称</a>
<button onclick="fn()">点击打开a标签</button>
<script>
  var a = document.getElementsByTagName('a')[0];
  function fn(){
    a.click();
  }
</script>
</body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jquery 双色表格实现代码
Dec 08 Javascript
jquery DOM操作 基于命令改变页面
May 06 Javascript
js中的scroll和offset 使用比较的实例与分析
Sep 29 Javascript
关于动态生成dom绑定事件失效的原因及解决方法
Aug 06 Javascript
js实现横向拖拽导航条功能
Feb 17 Javascript
JavaScript反弹动画效果的实现代码
Jul 13 Javascript
js学习总结之DOM2兼容处理this问题的解决方法
Jul 27 Javascript
js取小数点后两位四种方法
Jan 18 Javascript
JS+canvas画布实现炫酷的旋转星空效果示例
Feb 13 Javascript
浅谈vue在html中出现{{}}的原因及解决方式
Nov 16 Javascript
JavaScript手写数组的常用函数总结
Nov 22 Javascript
vue打包时去掉所有的console.log
Apr 10 Vue.js
jquery插件jquery.confirm弹出确认消息
Dec 22 #Javascript
js实现仿微博滚动显示信息的效果
Dec 21 #Javascript
Javascript实现Array和String互转换的方法
Dec 21 #Javascript
图解Sublime Text3使用技巧
Dec 21 #Javascript
七个不允许错过的jQuery小技巧
Dec 21 #Javascript
jQuery焦点图插件SaySlide
Dec 21 #Javascript
Flow之一个新的Javascript静态类型检查器
Dec 21 #Javascript
You might like
动漫定律:眯眯眼都是怪物!这些角色狠话不多~
2020/03/03 日漫
PHP编程中尝试程序并发的几种方式总结
2016/03/21 PHP
PHP简单实现DES加密解密的方法
2016/07/12 PHP
PHP的PDO预处理语句与存储过程
2019/01/27 PHP
php快速导入大量数据的实例方法
2019/09/23 PHP
javascript中RegExp保留小数点后几位数的方法分享
2013/08/13 Javascript
纯JS实现动态时间显示代码
2014/02/08 Javascript
详谈jQuery中的this和$(this)
2014/11/13 Javascript
学习JavaScript设计模式(策略模式)
2015/11/26 Javascript
原生JavaScript编写canvas版的连连看游戏
2016/05/29 Javascript
Javascript实现图片不间断滚动的代码
2016/06/22 Javascript
headjs实现网站并行加载但顺序执行JS
2016/11/29 Javascript
Vue.js实现简单动态数据处理
2017/02/13 Javascript
浅谈react 同构之样式直出
2017/11/07 Javascript
json数据传到前台并解析展示成列表的方法
2018/08/06 Javascript
微信小程序实现留言板
2018/10/31 Javascript
JSX在render函数中的应用详解
2019/09/04 Javascript
[01:01:51]EG vs VG Supermajor小组赛B组 BO3 第二场 6.2
2018/06/03 DOTA
python获取当前时间对应unix时间戳的方法
2015/05/15 Python
利用python批量修改word文件名的方法示例
2017/10/17 Python
Windows下将Python文件打包成.EXE可执行文件的方法
2018/08/03 Python
python3.5 cv2 获取视频特定帧生成jpg图片
2019/08/28 Python
使用python制作一个解压缩软件
2019/11/13 Python
Python获取对象属性的几种方式小结
2020/03/12 Python
Python自定义sorted排序实现方法详解
2020/09/18 Python
Python+Appium实现自动化清理微信僵尸好友的方法
2021/02/04 Python
Python就将所有的英文单词首字母变成大写
2021/02/12 Python
记一次高分屏下canvas模糊问题
2020/02/17 HTML / CSS
Joie官方网上商店:购买服装和女装配饰
2018/06/05 全球购物
Hawes & Curtis官网:英国经典品牌
2019/07/27 全球购物
华为消费者德国官方网站:HUAWEI德国
2020/11/03 全球购物
C#如何允许一个类被继承但是避免这个类的方法被重载?
2015/02/24 面试题
大学生预备党员自我评价分享
2013/11/16 职场文书
2014年端午节演讲稿范文
2014/05/23 职场文书
2014高三学生考试作弊检讨书
2014/12/14 职场文书
Python中OpenCV实现简单车牌字符切割
2021/06/11 Python