jQuery：触发 click() 不起作用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5577555/
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
jQuery: trigger click() doesn't work?
提问by marioosh
Why clicking on trigger1and trigger2doesn't fire click on open?
为什么点击trigger1和trigger2不火点击open？
<a id="trigger1" href="#" onclick="jQuery('#open').trigger('click');">trigger1</a>
<a id="trigger2" href="#" onclick="jQuery('#open').click();">trigger2</a>
<a id="open" href="http://google.com">open</a>
Using ready(trigger3) doesn't work too:
使用ready( trigger3) 也不起作用：
<a id="trigger3" href="#">trigger3</a>
...
...
jQuery(document).ready(function(){
jQuery('#trigger3').bind('click', function(){
jQuery('#open').html('to be fired'); /* works */
jQuery('#open').click();
});
jQuery('#trigger3').click(function(){
jQuery('#open').html('to be fired'); /* works */
jQuery('#open').click();
});
});
回答by Jake
It's important to clarify that doing jQuery('#open').click()does not execute the href attribute of an anchor tag so you will not be redirected. It executes the onclickevent for #openwhich is not defined.
重要的是要澄清这样做jQuery('#open').click()不会执行锚标记的 href 属性，因此您不会被重定向。它执行未定义的onclick事件#open。
You can accomplish the redirect and the ability to cause it with your original jQuery('#open').click()code by giving #opena click event:
您可以jQuery('#open').click()通过提供#open单击事件来完成重定向并能够使用原始代码实现重定向：
jQuery('#open').click( function (e) {
window.location.href = this.href;
});
回答by Scoobler
From what your code looks like, you want when a user clicks on link one or two (trigger 1 or 2)you want the link in opento be followed?
从您的代码看起来，您希望当用户单击链接一或两个（触发器 1 或 2）时，您希望open跟随链接？
If this is the case, .click()isn't actually the function you want, in fact jQuery doesn't seem to offer a method of directly clicking on an anchor element. What it will do is trigger any event's which are attached to an element.
如果是这种情况，.click()这实际上不是您想要的功能，事实上 jQuery 似乎没有提供直接单击锚元素的方法。它会做的是触发任何附加到元素的事件。
Take a look at this example:
看看这个例子：
<a id="trigger" href="#" onclick="$('#open').click();">trigger</a>
<a id="open" href="http://google.com">open</a>
jQuery:
jQuery：
$('#open').click(function(){
alert('I just got clicked!');
});
So there is an event attached to the element with the ID openthat simply alerts to say it was clicked. Clicking on the trigger link simply triggers the click event on the element with the ID open. So it's not going to do what you want! It will fire any events but it won't actually follow the link
I removed the 2nd trigger because .click()is just a proxy for .trigger('click')so they do the same thing!
所以有一个事件附加到带有 ID 的元素上，open它只是提醒说它被点击了。单击触发器链接只会触发 ID 元素上的单击事件open。所以它不会做你想做的事！它会触发任何事件，但它实际上不会跟随我删除了第二个触发器的链接，
因为.click()它只是一个代理，.trigger('click')所以它们做同样的事情！
So to trigger an actual click on an anchor, you will have to do a little more work. To make this slightly more reuseable I would change your HTML a little (I'll expain why in a moment):
因此，要触发对锚点的实际点击，您将需要做更多的工作。为了使其更易于重用，我将稍微更改您的 HTML （稍后我将解释原因）：
<a href="#" class="trigger" rel="#open">trigger google</a>
<a id="open" href="http://google.com">google</a>
<br/><br/>
<a href="#" class="trigger" rel="#bing">trigger bing</a>
<a id="bing" href="http://bing.com">bing</a>
jQuery (shortest):
jQuery （最短）：
$('.trigger').click(function(e){
e.preventDefault();
window.location = $($(this).attr('rel')).attr('href');
});
OR:
或者：
$('.trigger').click(function(e){
e.preventDefault();
var obj = $(this).attr('rel');
var link = $(obj).attr('href');
window.location = link;
});
Basically any link you want to follow another element add the class="trigger"to, this way it is re-useable. In the element you have added the classto, add a rel="#element-to-be-clicked"this will allow you to setup multiple clicks on different links.
基本上任何你想跟随另一个元素的链接都添加class="trigger"到，这样它就可以重复使用。在您添加class到的元素中，添加一个rel="#element-to-be-clicked"这将允许您在不同的链接上设置多次点击。
- So you are now capturing any clicks on an element with the
class="trigger" - Finding the element you wanted to be clicked on
rel="#element-to-be-clicked" - Getting the
hrefaddress from the element - Changing the windows location to the new link
- 因此，您现在正在使用
class="trigger" - 找到你想要点击的元素
rel="#element-to-be-clicked" href从元素中获取地址- 将窗口位置更改为新链接
回答by Santosh Linkha
try with removing onclick="jQuery('#open').click();"
尝试删除 onclick="jQuery('#open').click();"
Also try to putting $('#trigger1')you are using jQuery('#trigger3')
也试着把$('#trigger1')你正在使用jQuery('#trigger3')
On JSFIDDLE here.
回答by Adeel
you are binding event clickto #trigger3twice. remove one of them
您将事件绑定click到#trigger3两次。删除其中之一
回答by ysrb
Try this:
尝试这个：
jQuery(document).ready(function(){
jQuery('#trigger3').bind('click', function(){
jQuery('#open').text('to be fired'); /* works */
jQuery('#open').click();
});
jQuery('#trigger3').click(function(){
jQuery('#open').text('to be fired'); /* works */
jQuery('#open').click();
});
});
jQuery('#open').html('to be fired'); will change the to just a text. That's why the 2nd select doesn't work.
jQuery('#open').html('被解雇'); 将更改为只是一个文本。这就是为什么第二个选择不起作用的原因。
回答by JoDev
There is 3 types of links depending of the hrefcontent :
根据href内容，有 3 种类型的链接：
1) The hrefis a url
2) The hrefis a javascript call like "javascript:"
3) The hrefis useless ("#", "javascript:void(0)", ...), the function is directly bound on the link
1) 这href是一个 url
2) 这href是一个 javascript 调用，如 "javascript:"
3) 这href是没用的 ("#", "javascript:void(0)", ...)，函数直接绑定在链接上
That's why I make this little plugin to call the good method :
这就是为什么我制作这个小插件来调用好方法：
(function( $ ){
$.fn.triggerClick = function() {
var href = $(this).attr('href');
//No useful link into href, try to call js click
if(href.indexOf('#') == 0 || href.indexOf('javascript:void(') == 0 || href == '') {
$(this).click();
//JS call
} else if(href.indexOf('javascript:') == 0) {
eval(href);
//URL
} else {
document.location.href = href;
}
};
})( jQuery );
To call it, just use $('DOMelement').triggerClick().
Hope this could help.
(This plugin is a prototype. Thank's to tell me if there is some errors...)
要调用它，只需使用$('DOMelement').triggerClick().
希望这会有所帮助。（这个插件是一个原型，如果有错误请告诉我...）
