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 可能不被旧浏览器支持滚动......