Javascript固定页脚覆盖焦点

Javascript固定页脚覆盖焦点,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我有一个我正在处理的网页,其中页面底部有一个固定的页脚 当用户在字段中进行制表键并将焦点设置在固定页脚下方的元素上时,页面不会向上滚动以显示聚焦的元素。有没有一种方法可以使用javascript自动滚动以确保焦点元素始终显示在页脚上方?如果所有输入字段都是s,则可以使用javascript这样做: [].forEach.call(document.getElementsByTagName("input"), function(element) { element.addEventLis

我有一个我正在处理的网页,其中页面底部有一个固定的页脚


当用户在字段中进行制表键并将焦点设置在固定页脚下方的元素上时,页面不会向上滚动以显示聚焦的元素。有没有一种方法可以使用javascript自动滚动以确保焦点元素始终显示在页脚上方?

如果所有输入字段都是
s,则可以使用javascript这样做:

[].forEach.call(document.getElementsByTagName("input"), function(element) {
    element.addEventListener("focus", function(event) {
        window.location.href = location.pathname + "#" + event.target.id;
    })
})
这应该做三件事:

  • 迭代每个
    元素
  • 向每个
    元素添加一个
    onfocus
    事件侦听器
  • 将窗口位置设置为文件名,再加上刚刚关注的元素的标签选择器
  • 希望这对你有帮助

    这里有一种jQuery方法可以做同样的事情:

    $("input").on("focus", function() {
        window.location.href = location.pathname + "#" + $(this).id;
    })
    

    稍微简单一点,但它做的事情是一样的。

    我想您正在寻找元素。scrollIntoView()函数

    请访问以查看和。提示:发布工作和代码。
        function setFocusToElement () {
          var element = document.getElementById("yourelement");
          element.focus();
          element.scrollIntoView();
        }