jQuery 单击一个按钮触发另一个按钮的单击事件
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/20707999/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Clicking on one button to trigger click event on another
提问by Yarin
I want to click on button 2 to trigger a click event on button 1.
我想单击按钮 2 以触发按钮 1 上的单击事件。
However, when I try the following, nothing happens when clicking on #2: no alert for #1 or #2.
但是,当我尝试以下操作时,单击 #2 时没有任何反应:#1 或 #2 没有警报。
HTML:
HTML:
<div id="container">
<button id="button-1">Button 1</button>
<button id="button-2">Button 2</button>
</div>
JS:
JS:
$('#container').on( "click", '#button-1', function(e){
alert('CLICKED 1');
});
$('#container').on( "click", '#button-2', function(e){
$('#button-1').trigger(e);
alert('CLICKED 2');
});
Moreover, if I put the #2 alert before the trigger, I end up with an infinite loop.
此外,如果我将 #2 警报放在触发器之前,我最终会陷入无限循环。
Why is this not working as expected?
为什么这不能按预期工作?
UPDATE:
更新:
I should have made it clear: the original event must be passed. In essence, we're trying to do what was done here, but with delegated events
我应该说清楚:原始事件必须通过。本质上,我们正在尝试做这里所做的事情,但使用委托事件
回答by Krishna
Use
用
$('#button-1').trigger('click');
or
或者
$('#button-1').trigger(e.type);
instead of
代替
$('#button-1').trigger(e);
Read about jquery .trigger() here
在此处阅读有关 jquery .trigger() 的信息
回答by adeneo
To properly trigger a delegated event you have to create an event object and pass it to trigger()
要正确触发委托事件,您必须创建一个事件对象并将其传递给 trigger()
$('#container').on( "click", '#button-2', function(e){
var event = jQuery.Event(e.type);
event.target = $('#button-1').get(0);
$('#container').trigger(event);
});
That way you're actually triggering the event on the element it was bound to, passing the selector the delegated event handler will filter on as the event.target
, so it will fire just as it would if the element was actually clicked.
这样,您实际上是在它绑定到的元素上触发事件,将选择器传递给委托的事件处理程序将过滤为event.target
,因此它会像实际单击元素一样触发。
Or you could use the original event if you change the event.target
或者,如果您更改 event.target,则可以使用原始事件
$('#container').on( "click", '#button-1', function(e){
alert('CLICKED 1');
});
$('#container').on( "click", '#button-2', function(e){
e.target = $('#button-1').get(0);
$('#container').trigger(e);
});
回答by Kapil Rupavatiya
When you need to call click event of any button then syntax is as below
当您需要调用任何按钮的点击事件时,语法如下
$('selector').trigger(event);
selector -> which tag's event you need to fire
选择器 -> 您需要触发哪个标签的事件
event -> which event you need to fire
事件 -> 您需要触发哪个事件
In your case you need to change following one line
在您的情况下,您需要更改以下一行
$('#button-1').trigger(e);
here you need pass event of e like click event, select event, etc.
在这里,您需要传递 e 事件,例如单击事件、选择事件等。
so solution is replace this line with any of the following line
所以解决方案是用以下任何一行替换这一行
$('#button-1').trigger(e.type);
$('#button-1').trigger("click");