如何滚动到jQuery中的元素？

我已经在JavaScript中完成了以下代码，将重点放在特定元素上（branch1是一个元素），

document.location.href="#branch1";

但是由于我也在Web应用程序中使用jQuery，所以我想在jQuery中执行上述代码。我已经尝试过，但是不知道为什么它不起作用，

$("#branch1").focus();

上面的jquery（focus（））代码不适用于div，而如果我尝试使用文本框使用相同的代码，则它可以正常工作，

请告诉我，如何使用jQuery专注于div元素？

谢谢！

检查jQuery.ScrollTo，我认为这是您想要的行为，检查演示。

对于我的问题，此代码有效，我不得不导航到页面加载时的锚标记：

$(window).scrollTop($('a#captchaAnchor').position().top);

因此，您可以在任何元素上使用它，而不仅仅是锚标记。

就像@ user293153一样，我只是发现了这个问题，似乎并没有正确回答。

他的回答是最好的。但是您也可以为该元素设置动画。

$('html, body').animate({ scrollTop: $("#some_element").offset().top }, 500);

您可以像这样扩展jQuery功能：

jQuery.fn.extend({
scrollToMe: function () {
    var x = jQuery(this).offset().top - 100;
    jQuery('html,body').animate({scrollTop: x}, 500);
}});

接着：

$('...').scrollToMe();

简单 ;-）

签出jquery-scrollintoview。

ScrollTo很好，但是通常您只想确保UI元素可见，而不必在顶部。ScrollTo对此无济于事。从scrollintoview的自述文件：

该插件如何解决用户体验问题

该插件将特定元素滚动到视图中，类似于浏览器的内置功能（DOM的scrollIntoView（）函数），但是工作方式不同（并且可以说更加用户友好）：

• 它仅在元素实际上不在视野中时滚动到元素；如果元素在视图中（可见文档区域中的任何位置），则不会进行滚动；
• 它使用动画效果滚动；当执行滚动时，用户确切地知道他们没有被重定向到任何地方，但是实际上看到他们只是在同一页面内的其他地方移动（以及移动方向）；
• 总会应用最少的滚动；当元素在可见文档区域上方时，它将滚动到可见区域的顶部；当元素在可见区域下方时，它将滚动到可见区域的底部；这是最一致的滚动方式-当滚动始终始终是顶部时，有时当元素靠近可滚动容器的底部时，元素无法将其滚动到顶部（因此滚动是不可预测的）；
• 当元素的大小超过可见文档区域的大小时，其左上角将被滚动到该位置；

采用

$（窗口）.scrollTop（）

它将窗口滚动到该项目。

 var scrollPos =  $("#branch1").offset().top;
 $(window).scrollTop(scrollPos);

我想您可能会在您拥有示例的情况下寻找“锚”。

<a href="#jump">This link will jump to the anchor named jump</a>
<a name="jump">This is where the link will jump to</a>

焦点jQuery方法与您要实现的目标有所不同。

如果只是尝试滚动到指定的元素，则可以使用Element的scrollIntoView方法。这是一个例子：

$target.get(0).scrollIntoView();

为了使focus（）函数在元素上起作用，div需要具有tabindex属性。缺省情况下，此类型的元素可能不执行此操作，因为它不是输入字段。您可以在-1处添加一个tabindex，以防止使用tab的用户关注它。如果您使用正的tabindex，则用户将能够使用tab专注于div元素。

下面是一个示例：http : //jsfiddle.net/klodder/gFPQL/

但是Safari不支持tabindex。