用jquery替换href点击行为

Replacing href click behavior with jquery

本文关键字：href jquery 替换      更新时间：2023-09-26

作为一个练习，我试图使导航栏中的链接收缩内容div，使用ajaxpage（）在#content中加载页面，然后将其向下滑动。我正在使用以下内容：

EDIT:我意识到我可能需要回调函数中的所有内容，所以我解决了这个问题。不过，这个电话仍然不起作用。

$(document).ready(function()
  {
  $("a.link").click(function() { 
    //...
    return false;
});
  $("#navbar a").click(function(){
    $("#content").slideUp(500,function(){
        var a_href = $(this).attr('href');
        ajaxpage(a_href, 'content');
        $("#content").slideDown(500);
        });
  });
});

链接为：

<a class="link" href="home.php">Home</a>

当我测试它时，内容div会正确地向上滑动，但随后它会停留在那里，不会发生任何其他事情。我在这里做错了什么？

编辑：经过一些调试，似乎是罪魁祸首：

var a_href = $(this).attr('href');

当我声明该变量并通过alert（）发送它时，它会显示"未定义"。我猜我没有正确地获取属性，所以这就是它挂起的地方！如何正确地获取您单击的链接的href属性？

我很确定您真正想要的是捕获被单击的元素的href。

$("#navbar a").click(function(){
    var a_href = $(this).prop('href');
    $("#content").slideUp(500,function(){
        ajaxpage(a_href, 'content');
        $("#content").slideDown(500);
    });
});

但我们要清楚的是，在ajax调用返回任何数据之前，$('#content').slideDown(500)；将要启动。您需要向ajaxpage添加一个回调以接受为$.ajax()的成功函数，这样您就可以确定何时启动slideDown()。

当您决定在使用attr()点击后应该使用href时。

$("#navbar a").click(function(){
    var a_href = $(this).attr('href');
    $("#content").slideUp(500,function(){
        ajaxpage(a_href, 'content');
        $("#content").slideDown(500);
        });
  });
相关文章：