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

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()的实例

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

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

发布了96 篇原创文章 · 获赞 228 · 访问量 1万+

猜你喜欢

转载自blog.csdn.net/weixin_44296929/article/details/103860375