jQuery 焦点不滚动

Question

如何将焦点集中到 HTML 元素(例如“a”)并且不更改当前的滚动设置。

例如。如果我使用:

$('#link').focus();

并且此链接在屏幕中不可见(例如位于可见区域下方)，浏览器向下滚动以显示该元素。如何在不移动滚动条的情况下设置焦点？我需要将滚动条保留在原来的位置。

我已经尝试过这个，但它会产生一些屏幕闪烁，这是一个黑客，而不是一个优雅的解决方案:

var st=$(document).scrollTop();
$('#link').focus();
$(document).scrollTop(st);

有人可以帮我吗？

Answer 1

试试这个:

$.fn.focusWithoutScrolling = function(){
  var x = window.scrollX, y = window.scrollY;
  this.focus();
  window.scrollTo(x, y);
  return this; //chainability

};

然后

$('#link').focusWithoutScrolling();

编辑:

据报道，这在 IE10 中不起作用。可能的解决方案是使用:

var x = $(document).scrollLeft(), y = $(document).scrollTop();

但我还没有测试过。