编程 Javascript

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程序设计有所帮助。

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

- Author -

fengyee_zju

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

extjs grid设置某列背景颜色和字体颜色的方法

Sep 03 Javascript

JS判断页面加载状态以及添加遮罩和缓冲动画的代码

Oct 11 Javascript

js利用事件的阻止冒泡实现点击空白模态框的隐藏

Jan 24 Javascript

Javascript获取当前日期的农历日期代码

Oct 08 Javascript

实现图片预加载的三大方法及优缺点分析

Nov 19 Javascript

简易的JS计算器实现代码

Oct 18 Javascript

完美解决jQuery 鼠标快速滑过后,会执行多次滑出的问题

Dec 08 Javascript

微信小程序实现图片上传功能

May 28 Javascript

浅谈webpack4.x 入门(一篇足矣)

Sep 05 Javascript

详解处理Vue单页面应用SEO的另一种思路

Nov 09 Javascript

bootstrap table实现合并单元格效果

Dec 24 Javascript

layui使用form表单实现post请求页面跳转的方法

Sep 14 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