How to focus on a form input text field on page load using jQuery?
Question
这可能很简单，但有人能告诉我如何在页面加载时让光标在文本框中闪烁吗？
12 answers
solution1
414 ACCPTED 2009-10-20 00:52:41
Set focus on the first text field:
$("input:text:visible:first").focus();
This also does the first text field, but you can change the [0] to another index:
$('input[@type="text"]')[0].focus();
Or, you can use the ID:
$("#someTextBox").focus();
solution2
100 2014-10-12 23:58:31
You can use HTML5 autofocus for this. You don't need jQuery or other JavaScript.
<input type="text" name="some_field" autofocus>
Note this will not work on IE9 and lower.
solution3
27 2009-10-20 00:51:10
Sure:
<head>
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$("#myTextBox").focus();
});
</script>
</head>
<body>
<input type="text" id="myTextBox">
</body>
solution4
21 2013-09-09 09:09:48
为什么每个人都使用 jQuery 来做这样简单的事情。
<body OnLoad="document.myform.mytextfield.focus();">
solution5
18 2009-10-20 08:51:18
Think about your user interface before you do this. I assume (though none of the answers has said so) that you'll be doing this when the document loads using jQuery's ready() function. If a user has already focussed on a different element before the document has loaded (which is perfectly possible) then it's extremely irritating for them to have the focus stolen away.
You could check for this by adding onfocus attributes in each of your <input> elements to record whether the user has already focussed on a form field and then not stealing the focus if they have:
var anyFieldReceivedFocus = false;
function fieldReceivedFocus() {
anyFieldReceivedFocus = true;
}
function focusFirstField() {
if (!anyFieldReceivedFocus) {
// Do jQuery focus stuff
}
}
<input type="text" onfocus="fieldReceivedFocus()" name="one">
<input type="text" onfocus="fieldReceivedFocus()" name="two">
solution6
12 2009-10-20 00:51:18
HTML:
<input id="search" size="10" />
jQuery:
$("#search").focus();
solution7
10 2013-04-07 21:45:17
Sorry for bumping an old question. I found this via google.
Its also worth noting that its possible to use more than one selector, thus you can target any form element, and not just one specific type.
eg.
$('#myform input,#myform textarea').first().focus();
This will focus the first input or textarea it finds, and of course you can add other selectors into the mix as well. Handy if you can't be certain of a specific element type being first, or if you want something a bit general/reusable.
solution8
7 2014-01-15 16:52:49
This is what I prefer to use:
<script type="text/javascript">
$(document).ready(function () {
$("#fieldID").focus();
});
</script>
solution9
3 2013-08-16 01:34:59
输入后放置
<script type="text/javascript">document.formname.inputname.focus();</script>
solution10
1 2019-04-06 22:23:56
单独的行$('#myTextBox').focus()不会将光标放在文本框中，而是使用：
$('#myTextBox:text:visible:first').focus();
solution11
0 2018-02-13 06:31:09
The Simple and easiest way to achieve this
$('#button').on('click', function () {
$('.form-group input[type="text"]').attr('autofocus', 'true');
});
solution12
0 2021-03-31 08:45:40
$("#search").focus();
您还可以使用 HTML5 元素<autofocus>
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.