javascript - Javascript 防止默认值不被执行

Question

我是 javascript 新手，我一直在玩防止 ajax 分页的默认命令，我有以下代码：

http://jsfiddle.net/6pqfH/2/

$('.pagination').click(function(e){
    e.preventDefault();
    // fade out current content
    $('.results').css("opacity", "0.5");
    // load new content
    // ....
    // unfade
    $('.results').css("opacity", "1");
    // go back up to top of the page
    $('html,body').scrollTop(0);
});

但是，它似乎不起作用，它链接到一个新页面，而不是执行淡入和淡出并将其带回页面顶部。我已经检查了不透明度和 scoll 的代码，它似乎是正确的，所以我在这里哪里出错了？

Answer 1

它执行两个步骤，您看不到它的原因是它立即执行。您需要添加延迟或动画来分解它。

$('.pagination').click(function(e){
    e.preventDefault();
    // fade out current content
    $('.results').css("opacity", "0.5");
    // load new content
    // ....
    // unfade
    $('.results').fadeTo('slow', 1, function() {
      $('html,body').scrollTop(0);
    });

});

Answer 2

这就是我认为你想要的：

http://jsfiddle.net/6pqfH/6/

<a class="pagination" id="num" href="#">4</a>  

我将 hred="/test" 替换为 href="#" 这样 a 将带您单独到达顶部。