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 相关文章推荐
[对联广告] JS脚本类
Aug 27 Javascript
iphone safari不支持position fixed的解决方法
May 04 Javascript
jQuery使用技巧简单汇总
Apr 18 Javascript
js中indexof的用法详细解析
Dec 24 Javascript
点击button获取text内容并改变样式的js实现
Sep 09 Javascript
node.js中的fs.rename方法使用说明
Dec 16 Javascript
基于JS2Image实现圣诞树代码
Dec 24 Javascript
基于jQuery的网页影音播放器jPlayer的基本使用教程
Mar 08 Javascript
利用jQuery实现CheckBox全选/全不选/反选的简单代码
May 31 Javascript
Angular实现跨域(搜索框的下拉列表)
Feb 16 Javascript
微信小程序 引入es6 promise
Apr 12 Javascript
antd vue table跨行合并单元格,并且自定义内容实例
Oct 28 Javascript
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
自己动手,丰衣足食 - 短波框形天线制作
2021/03/01 无线电
深入剖析PHP中printf()函数格式化使用
2016/05/23 PHP
PHP实现四种基础排序算法的运行时间比较(推荐)
2016/08/11 PHP
微信小程序 消息推送php服务器验证实例详解
2017/03/30 PHP
phpstudy2018升级MySQL5.5为5.7教程(图文)
2018/10/24 PHP
通过PHP实现获取访问用户IP
2020/05/09 PHP
jQuery)扩展jQuery系列之一 模拟alert,confirm(一)
2010/12/04 Javascript
JS的replace方法详细介绍
2012/11/09 Javascript
Js 冒泡事件阻止实现代码
2013/01/27 Javascript
超棒的响应式布局jQuery插件Freetile.js
2014/11/17 Javascript
超赞的动手创建JavaScript框架的详细教程
2015/06/30 Javascript
使用 Vue.js 仿百度搜索框的实例代码
2017/05/09 Javascript
Nodejs实现文件上传的示例代码
2017/09/26 NodeJs
详解vue的diff算法原理
2018/05/20 Javascript
少女风vue组件库的制作全过程
2019/05/15 Javascript
在nodejs中创建child process的方法
2021/01/26 NodeJs
[01:10]为家乡而战!完美世界城市挑战赛全国总决赛花絮
2019/07/25 DOTA
python 字符串格式化代码
2013/03/17 Python
搭建Python的Django框架环境并建立和运行第一个App的教程
2016/07/02 Python
Django框架的使用教程路由请求响应的方法
2018/07/03 Python
详解基于django实现的webssh简单例子
2018/07/17 Python
BeautifulSoup中find和find_all的使用详解
2020/12/07 Python
HTML5网页音乐播放器的示例代码
2017/11/09 HTML / CSS
新西兰最大的在线设计师眼镜店:SmartBuyGlasses新西兰
2017/10/20 全球购物
美国鲍勃商店:Bob’s Stores
2018/07/22 全球购物
美国在线眼镜店:GlassesShop
2018/11/15 全球购物
材料物理专业个人求职信
2013/12/15 职场文书
教师简历自我评价
2014/02/03 职场文书
2015年物流客服工作总结
2015/07/27 职场文书
2015年中学体育教师工作总结
2015/10/23 职场文书
三好学生评选事迹材料(2016精选版)
2016/02/25 职场文书
详解用Python把PDF转为Word方法总结
2021/04/27 Python
Python关于OS文件目录处理的实例分享
2021/05/23 Python
python四个坐标点对图片区域最小外接矩形进行裁剪
2021/06/04 Python
通过Qt连接OpenGauss数据库的详细教程
2021/06/23 PostgreSQL
Mysql的Table doesn't exist问题及解决
2022/12/24 MySQL