我有一些页面有多个输入框，用户可以在其中输入文本。在单击“下一步”按钮之前，需要填写其中一些内容。我弹出验证错误供用户查看，但是如果问题不在页面上，我希望页面滚动到它，而不是他们必须搜索丢失/错误的字段。
我有一个滚动到位，但我无法确定要滚动到哪个元素。例如，如果输入位于页面折叠上方，我想滚动到标签，以便他们可以看到错误和输入。但如果它位于首屏下方，我想选择输入，以便将其显示在首屏上方。这有任何意义吗？
我想我真正要问的是，有没有办法确定元素在页面上的位置。如果它位于首屏上方，则滚动到标签，但如果它位于首屏下方，则滚动到输入？
现在我只是滚动到错误的输入字段。
$(".container-content").mCustomScrollbar("scrollTo",$('.container-content').find('input.error:first')); //Yes I am using a plugin for the scroll
if I just scroll to the label then it looks like this.
您可以使用此功能：Jsfiddle http://jsfiddle.net/azjbrork/
function isElementInViewport (el) {
var rect = el[0].getBoundingClientRect();
return (rect.top>-1 && rect.bottom <= $(window).height());
}
最初发布Here https://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport/7557433#7557433
New api只需 11 个额外步骤即可使用，哈哈https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#Browser_compatibility https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#Browser_compatibility