Javascript专注于DIV元素不适用于chrome

Question

您好，我想在页面加载后立即关注 div。它在 Firefox 上运行完美，但在 chrome 上却不行，它不工作。这是我的代码：

https://jsfiddle.net/9yb2boxn/

document.getElementById("focusme").focus();

#focusme {width:400px; height:100px; overflow-y:scroll; }

<div id="focusme">
  focus me focus me focus me focus me  focus me focus me focus me focus me  focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me
</div>

在 Firefox 中，当我运行此代码并按下键盘上的向下箭头时，div 会向下滚动。但不在铬上。为什么会出现这个问题？

我已经尝试过了

setTimeout(function() {

   document.getElementById("focusme").focus();

}, 1); 

还是不行。

请帮忙。谢谢

Answer 1

如果你想让一个不可聚焦的元素成为焦点，你必须给它添加一个 tabindex 属性：

<div id="focusme" tabindex="1"></div>

此外，您可以使用 ID 通过位置哈希来访问它。 在此处查看您的问题的答案： Is it possible to focus on a <div> using javascript focus() function?

Answer 2

如果您想通过 javascript 将焦点设置为 div，您可以使用以下代码

$("#focusme").attr("tabindex",-1).focus();

希望对你有所帮助。

 $("#focusme").attr("tabindex",-1).focus();

#focusme {width:400px; height:100px; overflow-y:scroll; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<div id="focusme">
  focus me focus me focus me focus me  focus me focus me focus me focus me  focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me focus me
</div>