如果我还没有通过 bind 或 click 将事件处理程序绑定到 < a > 链接，那么是否可以调用 jQuery 的 click ()来跟踪 < a > 链接？

我的 JavaScript 中有一个计时器，它需要模拟单击一个链接，以便在时间过去后转到另一个页面。为此，我使用 jQuery 的 click()函数。我已经使用了 $().trigger()和 window.location也，我可以使它的工作与所有三个打算。

我观察到 click()有一些奇怪的行为，我想弄明白发生了什么，为什么会这样。

我在这个问题中描述的所有内容都使用 Firefox，但我也对其他浏览器将如何处理这些内容感兴趣。

如果我没有使用 $('a').bind('click',fn)或 $('a').click(fn)来设置事件处理程序，那么调用 $('a').click()似乎什么也不做。它不调用此事件的浏览器默认处理程序，因为浏览器不加载新页。

但是，如果我首先设置一个事件处理程序，那么即使事件处理程序什么也不做，它也会按预期的方式工作。

$('a').click(function(){return true;}).click();

这会加载新页面，就像我亲自点击了 a 一样。

所以我的问题是双重的: 这种奇怪的行为是因为我在某个地方做错了什么吗？如果我没有创建自己的处理程序，那么为什么调用 click()对默认行为没有任何作用呢？

正如霍夫曼在试图复制我的结果时所确定的那样，我上面描述的结果实际上并没有发生。我不确定是什么导致了我昨天观察到的事件，但是我今天确定这不是我在问题中所描述的。

所以答案是你不能在浏览器中“假”点击，而 jQuery 所做的只是调用事件处理程序。您仍然可以使用 window.location来更改页面，这对我来说很好。

449855 次浏览
小开

它不执行任何操作，因为没有任何事件与该事件绑定。如果我没记错的话，jQuery 维护自己的事件处理程序列表，这些事件处理程序出于性能和其他目的绑定到 NodeList。

小开

如果你查看 $.click函数的代码，我敢打赌有一个 If判断语句可以检查元素在继续执行之前是否已经为 click事件注册了侦听器。为什么不直接从链接中获取 href属性并手动更改页面位置呢？

 window.location.href = $('a').attr('href');

下面是它为什么不点击通过的原因:

 // Handle triggering native .onfoo handlers (and on links since we don't call .click() for links)
if ( (!elem[type] || (jQuery.nodeName(elem, 'a') && type == "click")) && elem["on"+type] && elem["on"+type].apply( elem, data ) === false )
event.result = false;


// Trigger the native events (except for clicks on links)
if ( !bubbling && elem[type] && !event.isDefaultPrevented() && !(jQuery.nodeName(elem, 'a') && type == "click") ) {
this.triggered = true;
try {
elem[ type ]();
// Prevent Internet Explorer from throwing an error for some hidden elements
}
catch (e)
{
}
}

在调用处理程序(如果有的话)之后，jQuery 会触发对象上的一个事件。但是，如果元素不是链接，它只为单击事件调用本机处理程序。我猜这是有目的的，出于某种原因。不管是否定义了事件处理程序，这都应该是正确的，所以我不确定为什么在您的案例中附加事件处理程序会导致调用本机 onClick处理程序。你必须做我所做的步骤，通过执行，看看它在哪里被调用。

小开

锚标记上的单击处理程序是 jQuery 中的一个特例。

我认为您可能会对锚的 onclick 事件(浏览器知道)和 jQuery 对象的 click 事件(它包装了 DOM 的锚标记的概念)感到困惑。

您可以下载 jQuery 1.3.2源代码 给你。

源代码的相关部分是第2643-2645行(为了便于理解，我将其分成了多行) :

// Handle triggering native .onfoo handlers (and on links since we don't call .click() for links)
if (
(!elem[type] || (jQuery.nodeName(elem, 'a') && type == "click")) &&
elem["on"+type] &&
elem["on"+type].apply( elem, data ) === false
)
event.result = false;
小开
最佳答案

有趣的是，这可能是 jQuery 的一个“特性请求”(即 bug)。如果将 jQuery 事件绑定到元素，那么 jQuery 单击事件只会触发元素上的单击操作(在 DOM 上称为 onClick 事件)。您应该访问 jQuery 邮件列表(http://forum.jquery.com/)并报告这一点。这可能是我们想要的行为，但我不这么认为。

编辑:

我做了一些测试，你说的是错误的，即使你把一个函数绑定到一个‘ a’标签，它仍然不会把你带到由 href 属性指定的网站。尝试以下代码:

<html>
<head>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script>
$(document).ready(function() {
/* Try to dis-comment this:
$('#a').click(function () {
alert('jQuery.click()');
return true;
});
*/
});
function button_onClick() {
$('#a').click();
}
function a_onClick() {
alert('a_onClick');
}
</script>


</head>
<body>
<input type="button" onclick="button_onClick()">
<br>
<a id='a' href='http://www.google.com' onClick="a_onClick()"> aaa </a>


</body>
</html>

除非你直接点击链接(不管有没有注释代码) ，否则它永远不会进入 google.com。还要注意的是，即使你将点击事件绑定到链接上，一旦你点击了按钮，它仍然不会变成紫色。只有你直接点击链接，它才会变成紫色。

我做了一些调查。Click 不应该与‘ a’标签一起使用，因为浏览器不支持 javascript 中的“假点击”。我的意思是，你不能用 javascript“点击”一个元素。使用‘ a’标签，您可以触发它的 onClick 事件，但是链接不会改变颜色(对于访问过的链接颜色，大多数浏览器的默认颜色是紫色)。所以使用 $()是没有意义的。Click 事件使用‘ a’标记，因为转到 href 属性的操作不是 onClick 事件的一部分，而是在浏览器中硬编码的。

小开

如果您只在一种情况下需要此特性，或者只在极少数情况下需要此特性(您的整个应用程序并不需要此特性)。我宁愿让 jQuery 保持原样(出于很多原因，包括能够更新到更新的版本、 CDN等等) ，并有以下解决方案:

// For modern browsers
$(ele).trigger("click");


// Relying on Paul Irish's conditional class names,
// <https://www.paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/>
// (via HTML5 Boilerplate, <https://html5boilerplate.com/>) where
// each Internet Explorer version gets a class of its version
$("html.ie7").length && (function(){
var eleOnClickattr = $(ele).attr("onclick")
eval(eleOnClickattr);
})()
小开

另一个选择当然是使用普通的 JavaScript:

document.getElementById("a_link").click()
小开

触发一个 超链接 < a > 元素，该元素位于您想要连接 jQuery 的元素内。 click ()到:

<div class="TopicControl">
<div class="articleImage">
<a href=""><img src="" alt=""></a>
</div>
</div>

在您的脚本中，您连接到您希望点击事件发生的主容器。然后使用标准的 jQuery 方法查找元素(type、 class 和 id)并点击。JQuery 输入一个递归函数来触发点击，然后通过使用事件‘ e’和 stop  传播()函数来中断递归函数，并返回 false，因为除了触发链接之外，你不希望 jQuery 做任何其他事情。

$('.TopicControl').click(function (event) {
$(this).find('a').click();
event.stopPropagation();
return false;
});

另一种解决方案是将容器封装在 < a > 元素中，并将其作为容器放置在 < div > 元素中。设置范围显示块，以符合 W3C 标准。

小开

JavaScript/jQuery 不支持以编程方式“单击”链接的默认行为。

相反，您可以创建一个表单并提交它。这样你就不必使用 window.location或者 window.open，因为它们经常被浏览器作为不想要的弹出窗口屏蔽掉。

这个脚本有两种不同的方法: 一种是尝试打开三个新的标签/窗口(它在 Internet Explorer 和 Chrome 中只打开一个，更多信息见下文) ，另一种是在链接点击时触发一个自定义事件。

方法如下:

超文本标示语言

<html>
<head>
<script src="jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="script.js" type="text/javascript"></script>
</head>


<body>
<button id="testbtn">Test</button><br><br>


<a href="https://google.nl">Google</a><br>
<a href="http://en.wikipedia.org/wiki/Main_Page">Wikipedia</a><br>
<a href="https://stackoverflow.com/">Stack Overflow</a>
</body>


</html>

JQuery (文件 Script.js)

$(function()
{
// Try to open all three links by pressing the button
// - Firefox opens all three links
// - Chrome only opens one of them without a popup warning
// - Internet Explorer only opens one of them WITH a popup warning
$("#testbtn").on("click", function()
{
$("a").each(function()
{
var form = $("<form></form>");
form.attr(
{
id     : "formform",
action : $(this).attr("href"),
method : "GET",
// Open in new window/tab
target : "_blank"
});


$("body").append(form);
$("#formform").submit();
$("#formform").remove();
});
});


// Or click the link and fire a custom event
// (open your own window without following
// the link itself)
$("a").on("click", function()
{
var form = $("<form></form>");
form.attr(
{
id     : "formform",
// The location given in the link itself
action : $(this).attr("href"),
method : "GET",
// Open in new window/tab
target : "_blank"
});


$("body").append(form);
$("#formform").submit();
$("#formform").remove();


// Prevent the link from opening normally
return false;
});
});

对于每个 link 元素，它:

  1. 创建一个表单
  2. 赋予它属性
  3. 将其追加到 DOM，以便提交
  4. 提交
  5. 从 DOM 中删除表单，删除所有痕迹 * 插入邪恶的笑声 *

现在您有了一个新的选项卡/窗口加载 "https://google.nl"(或者任何您想要的 URL，只需替换它)。不幸的是，当您试图以这种方式打开多个窗口时，在试图打开第二个窗口时会得到一个 Popup blocked消息栏(第一个窗口仍然打开)。

更多关于我如何得到这种方法的信息可以在这里找到:

小开

若要在同一选项卡中打开超链接，请使用:

$(document).on('click', "a.classname", function() {
var form = $("<form></form>");
form.attr(
{
id     : "formid",
action : $(this).attr("href"),
method : "GET",
});


$("body").append(form);
$("#formid").submit();
$("#formid").remove();
return false;
});
小开

可以使用 jQuery 为该元素选择 jQuery 对象。然后，获取底层 DOM 元素并调用它的 click()方法。

身份证:

$("#my-link").each(function (index) { $(this).get(0).click() });

或者使用 jQuery 按 CSS 类单击一组链接:

$(".my-link-class").each(function (index) { $(this).get(0).click() });
小开 
$("#a_id")[0].click();

提交答案