jquery 选项卡切换链接以便它们跳转到页面顶部？

Question

redsquare 给了我很大的帮助，让我能够从内容中的链接更改 jquery 选项卡，但我还有一个问题正在寻求支持......

当用户单击链接切换到不同的链接时从内容中选项卡，我可以让页面跳转到页面顶部吗？

在我的演示链接中，滚动到页面底部以单击链接，它们会完美地切换选项卡，如果向上滚动，您可以确认这一点。

因此，我正在寻找将用户跳转到页面顶部的开关，这样用户就不必“滚动”到页面顶部来开始阅读新内容。

这是我的演示： http://jsbin.com/etoku3/11

现有代码：

<script type="text/javascript">
    $(document).ready(function() {
        var $tabs = $("#container-1").tabs();
        var changeTab = function(ev){
          ev.preventDefault();
          var tabIndex = this.hash.charAt(this.hash.length-1) -1;
          $tabs.tabs('select', tabIndex);
         };
        $('a.tablink').click(changeTab);
    });
</script> 

Answer 1

将其放入 changeTab 函数中：

 $('body').scrollTop(0);

您的代码：

$(document).ready(function() {

    var $tabs = $("#container-1").tabs();

    var changeTab = function(ev){

      ev.preventDefault();

      var tabIndex = this.hash.charAt(this.hash.length-1) -1;

      $tabs.tabs('select', tabIndex);

      $('html,body').scrollTop(0);  // Scroll to top
     };

    $('a.tablink').click(changeTab);

});

---

编辑：

如果您想将其设置为动画到顶部，请使用以下代码：

$('html,body').animate({scrollTop:0}, 500)

Answer 2

window.location = "#";
简单，没有旧浏览器可能不支持的 JavaScript 滚动...