如何关注一个表单输入文本字段的页面加载使用jQuery?

这可能很简单，但是谁能告诉我如何让光标在页面加载时在文本框上闪烁?

480760 次浏览
小开

肯定的:

<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>
小开

HTML:

  <input id="search" size="10" />

jQuery:

$("#search").focus();
小开
最佳答案

将焦点设置在第一个文本字段:

 $("input:text:visible:first").focus();

这也适用于第一个文本字段，但你可以将[0]更改为另一个索引:

$('input[@type="text"]')[0].focus();

或者，你可以使用ID:

$("#someTextBox").focus();
小开

在这样做之前，请考虑一下您的用户界面。我假设(虽然没有一个答案这么说)，你会这样做时，文档加载使用jQuery的ready()函数。如果用户在文档加载之前已经将焦点放在了不同的元素上(这是完全有可能的)，那么对他们来说，焦点被窃取是非常令人恼火的。

你可以通过在你的每个<input>元素中添加onfocus属性来检查这一点，以记录用户是否已经关注了一个表单字段，如果他们已经关注了，那么不要窃取焦点:

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">
小开

抱歉问了一个老问题。我通过谷歌找到了这个。

值得注意的是，它可以使用多个选择器，因此您可以针对任何表单元素，而不仅仅是一个特定的类型。

如。

$('#myform input,#myform textarea').first().focus();

这将聚焦它找到的第一个输入或文本区域，当然你也可以添加其他选择器。如果您不能确定特定的元素类型是第一个，或者如果您想要一些通用/可重用的东西，这很方便。

小开

输入后放置

<script type="text/javascript">document.formname.inputname.focus();</script>
小开

为什么每个人都用jQuery来做这么简单的事情。

<body OnLoad="document.myform.mytextfield.focus();">
小开

这是我更喜欢使用的:

<script type="text/javascript">
$(document).ready(function () {
$("#fieldID").focus();
});
</script>
小开

你可以使用HTML5 autofocus。你不需要jQuery或其他JavaScript。

<input type="text" name="some_field" autofocus>

注意这在IE9及更低版本上不起作用。

小开

实现这一目标的最简单和最简单的方法

$('#button').on('click', function () {
$('.form-group input[type="text"]').attr('autofocus', 'true');
});
小开

$('#myTextBox').focus()本身不会将光标放在文本框中，而是使用:

$('#myTextBox:text:visible:first').focus();
小开

$("#search").focus();

你也可以使用HTML5元素<autofocus>


提交答案