logo标签列表

使用jQuery编程点击<a>链接

jqueryhyperlinkclickanchor
62

我知道这个问题以前被问过，但在网上搜索后，似乎找不到一个直截了当的答案。

HTML代码：

<a id=myAnchor href=index.php>

jQuery（这两个都不起作用）

 $('#myAnchor').click();
或者
$('#myAnchor').trigger('click');

如何以最简单和高效的方式实现这个？

单击不会触发链接的默认行为。这个问题已经被问过很多次了。 - Rob W
可能是重复的问题：如果我还没有使用bind或click绑定事件处理程序，我可以调用jQuery click()来跟踪<a>链接吗？ - Rob W
jQuery的click事件无法在超链接上生效。 - fyr
1
我希望你的 HTML 实际上不是那样的。一个正常的 HTML 锚点看起来像：<a id="myAnchor" href="index.php">文本</a>（带引号和适当的闭合标签）。 - Cᴏʀʏ
2
@Cory：如果您不验证XHTML，则这些值不需要引号。 - user1106925
@amnotiam：我知道可以省略它们，但是HTML规范鼓励使用它们。 - Cᴏʀʏ
9个回答
105

试一试：

$('#myAnchor')[0].click();

对我有效。

1
这对我来说是最有效的，其他方法都不行。非常感谢！+1 - Maxx
3
如果您需要广泛的兼容性，由于其与旧版浏览器存在问题，请勿使用此功能。请注意，此功能存在兼容性问题。 - user1106925
1
谢谢！我已经尝试了多年如何通过编程点击链接。对我来说，最棘手的问题是没有加上那个"[0]"。那叫什么，为什么它是必要的？ - Eric Hepperle - CodeSlayer2010
3
@EricHepperle-CodeSlayer2010，“[0]”是“.get（0）”的简写，该方法返回JQuery对象所指向的基础DOM元素。这使您能够直接在DOM元素上调用“.click（）”方法，从而起作用，而不是在不起作用的jQuery对象上调用它。 - SGT Grumpy Pants
1
@10GritSandpaper 啊哈...谢谢你的解释！我现在明白了。 - Eric Hepperle - CodeSlayer2010
显示剩余2条评论
35
window.location = document.getElementById('myAnchor').href
1
我个人更喜欢这种方法，因为它避免了创建“伪造”事件的需要。 - Rory McCrossan
2
这曾经是一种流行的重定向链接方式，但现在它已经成为了失传的古老技术 :) - OKEEngine
只有当锚点的目的是重定向时，才会使用 @RoryMcCrossan 提到的方式。如果不是这样呢？如果它打开一个模态框？或者发送一个 Ajax 请求？或者通过 pjax 加载页面呢？ - Sinstein
1
在这种情况下，您应该直接调用执行这些操作的函数，而不是模拟单击按钮事件。 - Rory McCrossan
25

点击只能触发点击事件/事件，而不能实际执行“跳转到链接-Href”操作。

您需要编写自己的处理程序，然后 $('#myAnchor').trigger('click'); 才能起作用...

$("#myAnchor").click(function(event)
{
  var link = $(this);
  var target = link.attr("target");

  if($.trim(target).length > 0)
  {
    window.open(link.attr("href"), target);
  }
  else
  {
     window.location = link.attr("href");
  }

  event.preventDefault();
});
1
我的最爱之一，因为它解决了目标问题。不过它会触发弹出拦截器吗？ - Jon P
4
<a href="#" id="myAnchor">Click me</a>

<script type="text/javascript">
$(document).ready(function(){
    $('#myAnchor').click(function(){
       window.location.href = 'index.php';
    });
})
</script>
4
将 onclick="window.location = this.href" 添加到您的 <a> 元素中。在此修改后，它可以按预期行为进行 .click()。要对页面上的每个链接执行此操作，您可以添加以下内容：
<script type="text/javascript">
    $(function () {
        $("a").attr("onclick", "window.location = this.href");
    });
</script>
只是提醒一下：在IE7中无法工作。IE7，去死吧！否则非常好的解决方法！ - Lionel
4
我尝试了上面提供的一些解决方案，但它们对我并没有起作用。这是一个对我奏效的页面链接：自动点击链接。
上述链接提供了许多解决方案，下面是对我有用的其中一个。
    <button onclick="fun();">Magic button</button>

    <!--The link you want to automatically click-->
    <a href='http://www.ercafe.com' id="myAnchor">My website</a>

现在在<script>标签内部，
<script>

     function fun(){
          actuateLink(document.getElementById('myAnchor'));
     }

     function actuateLink(link)
     {
          var allowDefaultAction = true;

          if (link.click)
          {
              link.click();
              return;
          }
          else if (document.createEvent)
          {
              var e = document.createEvent('MouseEvents');
              e.initEvent(
                   'click'     // event type
                   ,true      // can bubble?
                   ,true      // cancelable?
              );
              allowDefaultAction = link.dispatchEvent(e);           
          }

          if (allowDefaultAction)       
          {
              var f = document.createElement('form');
              f.action = link.href;
              document.body.appendChild(f);
              f.submit();
          }
    }

</script>

复制并粘贴上述代码，点击“魔法按钮”，您将被重定向到ErCafe.com。

1
这是我情况下唯一有效的方法！有些人甚至说jQuery的click事件很简单--但对我来说根本不起作用。这个解决方案真是太棒了。 - Ness
1

我遇到了类似的问题。尝试这个$('#myAnchor').get(0).click();，这对我有用。

0
如果您正在使用jQuery，您可以使用jQuery.triggerhttp://api.jquery.com/trigger/来完成它。
示例
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-2.2.3.js"></script>
</head>
<body>
    <a id="foo" onclick="action()"></a>
    <script type="text/javascript">
        function action(){
            window.location.replace("https://dev59.com/Ymox5IYBdhLWcg3wnlpI")
        }

        $("#foo").trigger("click");
    </script>
</body>
</html>
0

为了兼容性，请尝试这个；

<script type="text/javascript">
        $(function() {
            setTimeout(function() {
                window.location.href = $('#myAnchor').attr("href");

            }, 1500);
        });
    </script>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接