使用 jquery 时抑制锚标记 <a> href答案

【问题标题】：Suppress anchor tag <a> href when using jquery使用 jquery 时抑制锚标记 <a> href
【发布时间】：2009-10-02 12:19:20
【问题描述】：

我有以下代码：

  <script type="text/javascript">

  $(document).ready(function() 
  {
    $("#thang").load("http://www.yahoo.com");

    $(".SmoothLink").click( function()
    {
      $("#thang").fadeOut();

      $("#thang").load($(this).attr("href"));           

      $("#thang").fadeIn();

    });
  });

  </script>

  <a href="http://www.google.com" id="thelink" class="SmoothLink">click here</a><br /><br />
  <div style="border: 1px solid blue;" id="thang">
  </div>

我想要实现的是一种快速简单的方式来对网站进行 ajax 化，只需将类放在我想要加载到 div 中的某些链接上。我遇到的问题是正常的锚点动作被触发并且只是正常地重定向到链接href。如何抑制正常的锚点动作？

【问题讨论】：

标签： javascript jquery ajax

【解决方案1】：

一般：

$('a').click(function(e) {
    //prevent the 'following' behaviour of hyperlinks by preventing the default action
    e.preventDefault();

    //do stuff

});

或：

$('a').click(function(e) {
    //do stuff

    //equivalent to e.preventDefault AND e.stopPropagation()
    return false;
});

上一个关于return false和e.preventDefault()区别的问题：

event.preventDefault() vs. return false

【讨论】：

不用过e吗？
您需要将e 参数添加到您的第一个函数定义中，但除此之外，光速和+1。
对于第一个，不应该有一个var传递给名为'e'的函数吗？
无论如何，将 e 排除在习惯之外永远不会有坏处。

【解决方案2】：

与您的问题不完全相关，但不是这样做......

$("#thang").fadeOut();
$("#thang").load($(this).attr("href"));
$("#thang").fadeIn();

...jQuery 旨在让您链接方法，例如：

$("#thang").fadeOut().load($(this).attr("href")).fadeIn();

【讨论】：