js自动触发点击事件

//  进入页面立即触发(()=>{//  兼容IEif(document.all) {document.getElementById("aid").click();}//  兼容其它浏览器else {var e = document.createEvent("MouseEvents");e.initEvent("click", true, true);document.getElementById("aid").dispatchEvent(e);}})();//  三秒后模拟点击
setTimeout(function() {//  IE浏览器if(document.all) {document.getElementById("clickMe").click();}//  其它浏览器else {var e = document.createEvent("MouseEvents");e.initEvent("click", true, true);document.getElementById("btn").dispatchEvent(e);}
}, 3000);

以下来自 https://blog.csdn.net/bellediao/article/details/105972387

1、自动点击
//自动点击的方法 clickId 点击事件的id属性值字符串类型

function autoClick(clickId) {// IEif (document.all) {document.getElementById(clickId).click();}// 其它浏览器else {var e = document.createEvent("MouseEvents");e.initEvent("click", true, true);document.getElementById(clickId).dispatchEvent(e);}
}

document.all是什么？
document.all是IE 4.0及以上版本的专有属性，是一个表示当前文档的所有对象的数组，不仅包括页面上可见的实体对象，还包括一些不可见的对象，如html对象等等。all[] 已经被 Document 接口的标准的 getElementByid() 方法和 getElementsByTagName() 方法以及 Document 对象的 getElementsByName() 方法所取代。尽管如此，这个 all[] 数组在已有的代码中仍然使用。

document.all的三个作用：
1、根据下标取元素：

语法： document.all[index];

index:要取的下标。

document.all(0)表示页面内第一个元素。

2、根据 name/id 取元素。

语法： document.all(“name/id” , index)

第二个参数index,可选。index表示如果有多个相同的name/id，取name/id集合中的第几个。当然id不应该重复。通过给某个元素设置id属性（id=aaaa）,然后用document.all.aaaa调用该元素。

在document.all数组里面，元素不分层次，是按照其在文档中出现的先后顺序，平行地罗列的。所以可以用数字索引来引用到任何一个元素。但比较常用的是用对象id来引用一个特定的对象，比如document.all[“element”]这样。

document.layers是Netscape 4.x专有的属性，是一个代表所有由储如

等定位了的元素的数组。通常也是用

或对象的id属性来引用的，但是这里面不包含除此以外的其它元素。新的统一的标准用document.getElementById等系列方法来引用DOM对象，而且Netscape 6.0以后放弃了layers特征，虽然IE继续保留了document.all，但这最终没有成为DOM标准的一部分。

3、document.all可以判断浏览器是否是IE

if(document.all){ alert(“is IE!”); }

2、使用定时器 setInterval() 方法实现按钮自动触发onclick事件
默认已点击，可以在加载网页的时候使用 onload 方法实现一次点击。

以下例子，实现网页打开时默认弹出弹窗，在关闭弹窗后，每2秒钟自动点击一次弹出弹窗，完整的代码如下：

<!doctype html>
<html>
<head><meta charset="utf-8"><title>自动点击例子</title>
</head>
<body onload="alert('这是默认点击弹窗')"><script type="text/javascript">setInterval(function () {if (document.all) {document.getElementById("buttonid").click();}else {var e = document.createEvent("MouseEvents");e.initEvent("click", true, true);document.getElementById("buttonid").dispatchEvent(e);}}, 2000);</script><input id="buttonid" type="button" value="按钮" onclick="alert('这是自动点击弹窗')" /><style type="text/css">input {background: red;color: #fff;padding: 10px;margin: 20px;}</style>
</body>
</html>

3、JQuery自动触发事件的方法。具体如下：
常用模拟
有时候，需要通过模拟用户操作，来达到单击的效果。例如在用户进入页面后，就触发click事件，而不需要用户去主动单击。

在JQuery中，可以使用trigger()方法完成模拟操作。例如可以使用下面的代码来触发id为btn的按钮的click事件。

$(’#btn’).trigger(“click”);

这样，当页面加载完毕后，就会立刻输出想要的效果。也可以直接简写click()，来达到同样的效果：

$(’#btn’).click();

触发自定义事件
trigger()方法不仅能触发浏览器支持的具有相同名称的事件，也可以触发自定义名称的事件。例如为元素绑定一个“myClick”的事件，JQuery代码如下：

$('#btn').bind("myClick", function(){$('#test').append("<p>我的自定义事件.</p>");});

//要触发这个事件，可以使用以下代码来实现：

$(’#btn’).trigger(“myClick”);
传递数据–trigger(type [,data])

trigger(type[，data])方法有两个参数，第1个参数是要触发的事件类型，第2个参数是要传递给事件处理函数的附加数据，以数组形式传递。通常可以通过传递一个参数给回调函数来区别这次事件是代码触发的还是用户触发的。

下面是一个传递数据的例子:

$(function(){$('#btn').bind("myClick", function(event, message1, message2){$('#test').append( "<p>"+message1 + message2 +"</p>");});$('#btn').click(function(){$(this).trigger("myClick",["我的自定义","事件"]);}).trigger("myClick",["我的自定义","事件"]);})

执行默认操作

trigger()方法触发事件后，会执行浏览器默认操作。例如：

$(“input”).trigger(“focus”);

以上代码不仅会触发为元素绑定的focus事件，也会使元素本身得到焦点（这是浏览器的默认操作）。

如果只想触发绑定的focus事件，而不想执行浏览器默认操作，

可以使用jQuery中另一个类似的方法——triggerHandler()方法。

$(“input”).triggerHandler(“focus”);
该方法会触发元素上绑定的特定事件，同时取消浏览器对此事件的默认操作，即文本框只触发绑定的focus事件，不会得到焦点。

js自动触发点击事件相关推荐

vue点击弹窗自动触发点击事件的解决办法
业务场景:使用vue +element ui 的el-dialog,点击弹窗之后,默认加载第一个按钮的数据进行初始化. div 指令: // 自动触发点击事件directives:{trigger:{ ...
Vue在页面加载时自动触发点击事件
在按钮中添加 v-trigger <el-button v-for="data in formData" v-if="data.selectStatus === 1 ...
vue 自动触发点击事件
需要,点击左边的菜单,顶部菜单相应改变,但是都需要点击事件,页面进来时,默认触发点击事件方法一,vue自定义指令 directives:{trigger:{inserted(el, binging) ...
js进入页面后自动触发点击事件
// 进入页面立即触发(()=>{// 兼容IEif(document.all) {document.getElementById("绑定的id").click();}// ...
自动点击按钮（即自动触发点击事件）
这段时间做项目,有一个特殊的需求,就是界面上有一个按钮,需要自动去触发. 找了下资料,发现有个api是可以完成的就是:sendActionsForControlEvents 这个下面就是使用方法 ...
如何自动触发点击事件
1. // 两秒后模拟点击 setTimeout(function() {// IEif(document.all) {document.getElementById("desc1" ...
android自动调用按钮事件,Android Button自动触发点击事件
原因开发过程中遇到button.performClick()无效,原因是View.performClick()需要再UI线程中调用才会有效执行. 响应系统调用的方法(比如报告用户动作的onKeyDo ...
js 回车触发点击事件
$(document).keyup(function(event){if(event.keyCode ==13){$("#submit").trigger("click& ...
Vue实现自动触发点击事件
使用VUE自定义指令实现 <el-tree :check-strictly="isCheck" ref="tree" :data="data&q ...

js自动触发点击事件

js自动触发点击事件

js自动触发点击事件相关推荐

最新文章

热门文章