欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

JQuery 的trigger()方法【点击一个按钮,实现另一个按钮的点击事件】

程序员文章站 2022-05-06 08:02:21
...

1、前阶段需要点击一个按钮然后触发另一个元素的点击事件,当时找了度娘,发现了trigger这个方法,哎,这么好用的方法我竟然之前不知道,至此记录一下;

2、trigger()方法:

  • trigger()方法触发被选元素上指定的事件以及事件的默认行为(比如表单提交)。
  • 该方法与triggerHandler()方法类似,不同的是triggerHandler()不触发事件的默认行为。

先不说他们两个的区别,先说一下trigger()方法:

1)trigger()的语法:$(selector).trigger(event,eventObj,param1,param2,…)

参数 描述
event 必需,规定指定元素上要触发的时间。可以是自定义事件,或者任何标准事件。
param1,param2,param3… 可选。传递到事件处理程序的额外参数。额外的参数对自定义事件特别有用。

3、首先写一个小demo解决上面的需求:

我们实现点击一个按钮,然后系统去点击我们定义好的一个div。

<button id="div2" type="submit">点我就对了</button>
<div id="div1"></div>
<script>
	window.onload=function(){
		$("#div2").click(function(){
		  $("#div1").trigger('click');
		});
		$("#div1").click(function(){
			alert("div被点击了");
		});
	}
</script>

其实trigger()方法不仅仅是实现点击事件,任何事件都可以,特别的强大。

4、trigger()与triggerHandler()的不同之处:

  • triggerHandler()不会引起事件(比如表单提交)的默认行为。
  • trigger()会操作jQuery对象匹配的所有元素,而triggerHandler()只影响第一个匹配元素。
  • 由triggerHandler()创建的事件不会在DOM树中冒泡;如果目标元素不直接处理它们,则不会发生任何事情。

可以看一下菜鸟教程上的实例:有关trigger()和triggerHandler()的实例

你要去做一个大人,不要回头,不要难过。

“如果工作只是因为无聊才找点事做,而不是为了恰饭。那该多好。”

相关标签: JQuery