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 相关文章推荐
JavaScript中的事件处理
Jan 16 Javascript
toString()一个会自动调用的方法
Feb 08 Javascript
js实现的真正的iframe高度自适应(兼容IE,FF,Opera)
Mar 07 Javascript
js 取时间差去掉周六周日实现代码
Dec 25 Javascript
js获取url参数代码实例分享(JS操作URL)
Dec 13 Javascript
js实现图片点击左右轮播
Jul 08 Javascript
AngularJS基础 ng-keypress 指令简单示例
Aug 02 Javascript
原生JavaScript实现AJAX、JSONP
Feb 07 Javascript
使用百度地图实现地图网格的示例
Feb 06 Javascript
小程序实现选择题选择效果
Nov 04 Javascript
vue 父组件中调用子组件函数的方法
Jun 06 Javascript
js实现全选和全不选
Jul 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
php+Mysqli利用事务处理转账问题实例
2015/02/11 PHP
php实现通用的信用卡验证类
2015/03/24 PHP
php生成二维码
2015/08/10 PHP
Yii2超好用的日期和时间组件(值得收藏)
2016/05/05 PHP
thinkPHP模板引擎用法示例
2016/12/08 PHP
PHP 构造函数和析构函数原理与用法分析
2020/04/21 PHP
判断多个input type=file是否有已经选择好文件的代码
2012/05/23 Javascript
轻松创建nodejs服务器(10):处理POST请求
2014/12/18 NodeJs
JavaScript中的操作符==与===介绍
2014/12/31 Javascript
浅谈javascript 函数内部属性
2015/01/21 Javascript
window.onload与$(document).ready()的区别分析
2015/05/30 Javascript
基于jquery实现放大镜效果
2015/08/17 Javascript
关于JS中setTimeout()无法调用带参函数问题的解决方法
2016/06/21 Javascript
jQuery的图片轮播插件PgwSlideshow使用详解
2016/08/11 Javascript
JS实现简单易用的手机端浮动窗口显示效果
2016/09/07 Javascript
jquery网页日历显示控件calendar3.1使用详解
2016/11/24 Javascript
jQuery Ajax全解析
2017/02/13 Javascript
Angular开发者指南之入门介绍
2017/03/05 Javascript
简单谈谈JS中的正则表达式
2017/09/11 Javascript
vue中选项卡点击切换且能滑动切换功能的实现代码
2018/11/25 Javascript
Vue ​v-model相关知识总结
2021/01/28 Vue.js
[01:45]亚洲邀请赛互动指南虚拟物品介绍
2015/01/30 DOTA
Ubuntu 14.04+Django 1.7.1+Nginx+uwsgi部署教程
2014/11/18 Python
利用Python的Django框架中的ORM建立查询API
2015/04/20 Python
python正则表达式之对号入座篇
2018/07/24 Python
Appium+python自动化怎么查看程序所占端口号和IP
2019/06/14 Python
安装不同版本的tensorflow与models方法实现
2021/02/20 Python
小学生自我评价范例
2013/09/24 职场文书
创伤外科专业推荐信范文
2013/11/19 职场文书
大学生求职推荐信
2013/11/27 职场文书
团组织推优材料
2014/12/29 职场文书
发布会邀请函
2015/01/31 职场文书
早上好问候语大全
2015/11/10 职场文书
php字符串倒叙
2021/04/01 PHP
SQL Server基本使用和简单的CRUD操作
2021/04/05 SQL Server
Win11任务栏太宽了怎么办?一招解决Win11任务栏太宽问题
2021/11/21 数码科技