Welcome 微信登录

首页 / 脚本样式 / JavaScript / jQuery如何使用自动触发事件trigger

有时候,需要通过模拟用户操作,来达到点击的效果,例如用户进入页面后
就触发click事件,而无需主动点击。
比如以下代码:
<body><a href="#" onclick="javascript:document.getElementById("d").innerHTML="x1"">点击1</a><a href="#" onclick="javascript:document.getElementById("d").innerHTML="x2"">点击2</a><a href="#" onclick="javascript:document.getElementById("d").innerHTML="x3"">点击3</a></br><span id="d"></span></body>
实现效果为"点击1"页面上将显示x1 ,"点击2"页面上显示x2 …
但需要实现首次进入页面为默认是"点击1"


在jQuery中,可以使用trigger()方法完成模拟操作。
例如可以使用下面的代码来触发A链接的click事件。
$("a").first().trigger("click");
这样 当页面加载完毕后,触发第一个A链接的click事件,页面将显示x1
触发自定义事件
trigger()方法不仅能触发浏览器支持的具有相同名称的事件,也可以触发自定义名称的事件。
例如为元素绑定一个”myEvent”的事件,jQuery代码如下:

$("#btn").bind("myEvent", function(){ alert("自定义事件");});

想要触发这个事件,可以使用以下代码来实现:
$("#btn").trigger("myEvent");
传递数据
trigger(type,[data])方法有两个参数,
第1个是事件对象或者要触发的事件类型,
第2个参数是传递给事件处理函数的附加参数,
以数组形式传递。通常可以通过传递一个参数给
回调函数来区别这次事件是代码触发的还是用户触发的。
下面是一个传递数据的例子。
$("#btn").bind("myEvent", function(event,message1,message2){ alert(message1 + "," + message2);});$("#btn").trigger("myEvent", ["Hello","World!"]);
以上就是jQuery自动触发事件trigger的使用方法,希望对大家的学习有所帮助。