Javascript focus on input box on load
Question
No matter what I do, this page doesn't work at all. I want it to focus on the input box on load.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Home Screen</title>
<style type="text/css">
input {border:0px;}
input:focus {outline:none;}
</style>
</head>
<body onload="document.getElementById("search").focus()">
<input id="search" />
</body>
</html>
I know I'm breaking a bunch of rules with this code, so you don't need to say anything about that.
EDIT:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Home Screen</title>
<style type="text/css">
input {border:0px;}
input:focus {outline:none;}
</style>
</head>
<body onload="document.getElementById('search').focus()">
<input id="search" onblur="setTimeout(document.getElementById('search').focus(),10)" />
</body>
</html>
EDIT 2:
<script type="text/javascript">
function refocus()
{
setTimeout(document.getElementById("search").focus(),10);
}
</script>
<input id="search" onblur="refocus()" />
6 answers
solution1
4 ACCPTED 2013-03-28 01:22:47
双引号不能包含双引号，不仅在javascript中，任何其他语言都一样。
<body onload="document.getElementById('search').focus()">
solution2
2 2013-03-28 01:16:38
I'f you're using jquery:
$(function() {
$("#search").focus();
});
or prototype:
Event.observe(window, 'load', function() {
$("search").focus();
});
or plain javascript:
window.onload = function() {
document.getElementById("search").focus();
};
It's "Better" for readability than an inline event...
solution3
0 2013-03-28 01:15:34
您必须将search放入单引号中：
<body onload="document.getElementById('search').focus()">
solution4
0 2013-03-28 01:16:43
将搜索放在单引号中，因为您在 document.getelementbyid 周围有双引号
<body onload="document.getElementById('search').focus()">
solution5
0 2013-03-28 01:17:43
Your experiencing this issue because you're using the same quotes inside the onfocus event, you can change "search" to 'search' to fix the issue.
<body onload="document.getElementById('search').focus()">
Ideally though, you should attach your events in JavaScript so your markup stays clear and all functional aspects of the page are located in one place.
<script type="text/javascript">
window.onload = function () {
document.getElementById("search").focus();
}
</script>
solution6
0 2015-09-10 07:47:11
Set some delay in your code by using setTimeout function to resolve this problem.
function fireOnClick() {
// Set text filed focus after some delay
setTimeout(function() { jQuery('#globalText').focus() }, 20);
// Do your work.....
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.