Javascript 将焦点移至页面元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12220806/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Move focus to page element
提问by Kinburn101
Possible Duplicate:
Move focus to a particular field
可能的重复：
将焦点移至特定字段
This should be an easy one. I'm trying to set the focus onclick to a <p>element on my page.
这应该是一件容易的事。我试图将 onclick 焦点设置为<p>我页面上的一个元素。
My javascript looks like this:
我的 javascript 看起来像这样：
function loadSubmit() {
if (document.getElementById('uploaded_file').value == "") {
this.setFocus("name");
} else {
var ProgressImage = document.getElementById('progress_image');
document.getElementById("progress").style.visibility = "visible";
//document.getElementById("progress").focus(); ?
setTimeout(function () {
ProgressImage.src = ProgressImage.src
}, 100);
}
}
I would like to shift the focus of the page to 'progress_image' any suggestions on how to accomplish this?
我想将页面的焦点转移到 'progress_image' 关于如何实现这一点的任何建议？
Thanks
谢谢
回答by Kinburn101
Thanks @rlemon for pointing me in the right direction. For those who come across this post seeking the same answer as me; my solution was as follows.
感谢@rlemon 为我指明了正确的方向。对于那些遇到这篇文章并寻求与我相同答案的人；我的解决方案如下。
If you need to set focus to an element on your page using an onclick event you can do so by defining your element with tabindex and an ID.
如果您需要使用 onclick 事件将焦点设置到页面上的某个元素，您可以通过使用 tabindex 和 ID 定义您的元素来实现。
For example I have:
例如我有：
<div id="whatever">sometext or whatever</div>
and I would like the to focus on that div with a submit button or the like. We already know this can be accomplished for input fields by using as other posters had suggested:
我希望通过提交按钮或类似按钮专注于该 div。我们已经知道这可以通过使用其他海报建议的输入字段来完成：
document.getElementById("whatever").focus();
With a simple change to your div like this:
像这样对你的 div 做一个简单的改变：
<div id="whatever" tabindex="-1">sometext or whatever</div>
your div will come into the page's focus with your onclick event. Now knowing this, it is as simple as positioning an empty div, or anchor, or whatever onto your page to achieve your desired results to set the proper focus.
您的 div 将通过您的 onclick 事件成为页面的焦点。现在知道了这一点，就像在您的页面上放置一个空的 div、锚点或其他任何东西一样简单，以实现您想要的结果以设置正确的焦点。
I hope this helps others and thanks again to other posters helping me out with this including: http://snook.ca/archives/accessibility_and_usability/elements_focusable_with_tabindex/
我希望这可以帮助其他人，并再次感谢其他海报帮助我解决这个问题，包括：http: //snook.ca/archives/accessibility_and_usability/elements_focusable_with_tabindex/
回答by Chase
You can see more about the focusfunction here: https://developer.mozilla.org/en-US/docs/DOM/element.focus
您可以在focus此处查看有关该功能的更多信息：https: //developer.mozilla.org/en-US/docs/DOM/element.focus
document.getElementById('fieldId').focus();
回答by Aghilas Yakoub
document.getElementById('progress_image').focus();
