在阅读下面讨论如何规避该问题的内容之前,让我更全面地回答您为什么会遇到这个问题:
Modern browsers take different actions for links based on things like which mouse button you clicked with, whether you held Shift / Ctrl / Alt, and so on. As an example, in Chrome, if you middle-click a link instead of left-clicking, the browser will automatically open the window in a new tab.
当你使用.click()
,jQuery 必须对您单击的“方式”做出假设 - 并且您会得到默认行为 - 在您的情况下,这不是正确的行为。您需要以以下形式指定浏览器的“正确”设置MouseEvents
设置以解决问题。
现在,简短讨论修复它的方法:
当你使用 jQuery 时.click()
没有参数的事件,这实际上并不是对相关元素“假装点击”。相反,根据 jQuery 文档http://api.jquery.com/click/ http://api.jquery.com/click/ :
... 什么时候.click()
不带参数调用,它是 .trigger("click") 的快捷方式
这意味着当你开火时$('#div1').click()
- 如果没有实际的 jQuery 处理程序'click'
事件,您将得到默认处理。因此,考虑这两种情况:
Case 1:
<a id='myLink' href='/some/link/'>Click me!</a>
<script type='text/javascript'>
$('#myLink').click();
</script>
在第一个场景中,.click()
call 不执行任何操作,因为没有相应的处理程序。事件触发,但没有任何东西可以捕获它并响应 - 所以a
使用标签的默认处理,并且用户被带到/some/link/
- 由于您没有指定哪个鼠标按钮或任何其他参数 - 它确实是默认值。
Case 2:
<a id='myLink' href='/some/link/'>Click me!</a>
<script type='text/javascript'>
$('#myLink').bind('click', function (ev) {
ev.preventDefault();
ev.stopPropagation();
alert('you clicked me!');
}).click();
</script>
在这种情况下,因为click
当用户单击链接时,处理程序被创建 -ev.preventDefault()
and ev.stopPropagation()
调用将停止发生默认处理,并且将触发警报。
然而此时,你有一个ev
代表的对象MouseEvents
- 如果您愿意,您可以更改设置。例如,您可以执行以下操作:
ev.altKey = true; // Held Alt
ev.button = 1; // Middle Mouse Button
这些设置将更改处理事件的默认方法。
替代的非 jQuery 解决方案
您还可以通过调整以下代码来真正模拟按钮单击。
function fakeClick(event, anchorObj) {
if (anchorObj.click) {
anchorObj.click()
} else if(document.createEvent) {
if(event.target !== anchorObj) {
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window,
0, 0, 0, 0, 0, false, false, false, false, 0, null);
var allowDefault = anchorObj.dispatchEvent(evt);
// you can check allowDefault for false to see if
// any handler called evt.preventDefault().
// Firefox will *not* redirect to anchorObj.href
// for you. However every other browser will.
}
}
}
(有关更完整的实施,请参阅原始帖子:如何模拟对锚标记的点击? https://stackoverflow.com/questions/1421584/how-can-i-simulate-a-click-to-an-anchor-tag/1421968#1421968- 并查看所选答案)
这实际上会让浏览器相信您通过鼠标单击锚点/跨度/等,以与浏览器的默认处理程序相同的方式从头开始构建事件 - 除了您可以覆盖某些设置。然而,我不建议这种方法,因为它更容易在跨浏览器应用程序上崩溃,并且您必须弄清楚所有参数映射到什么。