取消锚标记<a> href when using jquery</a>

时间:2009-10-02 02:42:57

标签: javascript jquery ajax

我有以下代码:

  <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-ify网站的一种快速简便的方法,只需在我想要加载到div中的某些链接上放一个类。我遇到的问题是正常的锚操作被触发,只是正常重定向到链接href。如何抑制正常锚定动作?

2 个答案:

答案 0 :(得分:8)

一般而言:

$('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;
});

更多信息:

http://docs.jquery.com/Events/jQuery.Event#event.preventDefault.28.29

关于return falsee.preventDefault()之间差异的上一个问题:

event.preventDefault() vs. return false

答案 1 :(得分:1)

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

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

... jQuery旨在让您链接方法,如下:

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