javascript - 动画结束时导航到 href

Question

所以我试图让一个部分在点击这样的链接之前淡出

<a class="fadelink" href="path/to/file">Hello</a>

<script type="text/javascript">
        $("a.fadelink").click(function(e){
            e.preventDefault();         
            $("#content").fadeTo(400,0,function(){
                window.location.href = $(this).attr("href");

            });
        });
    </script>

问题是，jQuery 一直以“未定义”和 404 的重定向返回给我。

Answer 1

您$(this)的 in$(this).attr("href")指向$("#content")哪个是错误的。将其移动到正确的范围内：

$("a.fadelink").on("click", function( evt ) {

   evt.preventDefault();   

   var goTo = $(this).attr("href");           // get href value of `this` anchor

   $("#content").fadeTo(400, 0, function() {
       window.location = goTo;                // Now you can use it
   });

});

Answer 2

你指的是错误的this。该href属性存在于锚点上，而不是#content元素上。

$("a.fadelink").click(function(e){
    e.preventDefault();
    var that = this;
    $("#content").fadeTo(400,0,function(){
        window.location.href = $(that).attr("href");

    });
});