如何在用户点击链接(<a>元素)时取消导航？

Question

当用户点击链接时,我正在尝试使用AJAX加载一些东西,但我希望链接实际上去某处,以便在禁用javascript时应用程序仍然有效.有没有办法只使用javascript做一些事情并在点击链接时取消导航？

什么是最佳做法？可以这样做,还是我需要使用javascript替换链接或什么？

Answer 1

如果您有这样的HTML:

<a href="no_javascript.html" id="mylink">Do Something</a>

你可以用jQuery做这样的事情:

$(document).ready(function() {
    $('#mylink').click(function() {
        doSomethingCool();
        return false; // cancel the event
    });
});

您所要做的就是使用Javascript取消click事件以防止发生默认操作.因此,当有人点击启用了Javascript的链接时,doSomethingCool();会调用并取消click事件(因此return false;)并阻止浏览器转到指定的页面.但是,如果他们禁用了Javascript,则会no_javascript.html直接使用它们.

Answer 2

这些对我来说都不适用于Google Chrome浏览器.

这是什么工作(使用jQuery):

$(document).ready(function() {
    $('#mylink').click(function(event) {
        doSomethingCool();
        event.preventDefault(); // cancel the event
    });
});

Answer 3

为什么jQuery？

HTML:

<a href="no_javascript.html" onclick="return doSmth()">Link</a>

...和javascript代码:

function doSmth(){
  // your code here
  return false
}

Answer 4

我会做的是:

一个.对于href属性,javascript:void();将被设置

湾 对于onclick事件,将提供一个处理click事件的函数,该函数将返回false.

例如:

<script type="text/javascript">
   function myfunction()
   {
      //do something
      return false;
   }
   </script>

   <a href="javascript:void();" onclick="myfunction()">Link</a>