98 
document.getElementById(frmObj.id).value="";
document.getElementById(frmObj.id).autofocus;
document.getElementById("errorMsg").innerHTML = "Only numeric value is allowed";

在上面的代码中，表单对象的值完美设置为，""但文本框中没有光标。我想要一个光标在那里。focus()仅聚焦该输入框，但并未实际设置光标。

4

8 回答 8

125

在JavaScript中，首先关注控件，然后选择控件以在 texbox 上显示光标...

document.getElementById(frmObj.id).focus();
document.getElementById(frmObj.id).select();

或使用jQuery 

$("#textboxID").focus();
于 2012-06-05T09:23:31.643 回答
64

我意识到这是一个相当古老的问题，但我有一个类似问题的“愚蠢”解决方案，也许可以帮助某人。

我在显示为选中的文本框（通过 JQuery 中的 Focus 方法）时遇到了同样的问题，但没有将光标移入。

事实是我打开了 Debugger 窗口以查看正在发生的事情，而那个窗口正在窃取焦点。解决方案非常简单：只需关闭调试器，一切都很好……花了 1 个小时进行测试！

于 2015-12-08T10:36:15.957 回答
8

有时您确实获得焦点，但文本字段中没有光标。在这种情况下，您可以这样做：

document.getElementById(frmObj.id).select();
于 2012-06-05T09:22:20.243 回答
5

如果您将.onmousedown其用作用户交互，那么可能会咬到您的一件事；当您这样做时，然后立即尝试选择一个字段，它不会发生，因为鼠标被按住在其他东西上。因此，更改为.onmouseup和 viola，现在focus()可以正常工作，因为当尝试更改焦点时，鼠标处于未单击状态。

于 2016-01-31T01:00:34.407 回答
2

这种方式将焦点和光标设置到输入的末尾：

div.getElementsByTagName("input")[0].focus();
div.getElementsByTagName("input")[0].setSelectionRange(div.getElementsByTagName("input")[0].value.length,div.getElementsByTagName("input")[0].value.length,"forward");
于 2019-10-18T06:25:26.073 回答
1

您没有提供足够的代码来帮助您可能提交表单并重新加载页面，或者您在页面上有一个对象，例如嵌入的 PDF，它窃取了焦点。

这是验证表单的规范纯 javascript 方法可以使用 onubtrusive JS 进行改进，这将删除内联脚本，但这是起点：

function validate(formObj) {
  document.getElementById("errorMsg").innerHTML = "";
  var quantity = formObj.quantity;
  if (isNaN(quantity)) {
    quantity.value = "";
    quantity.focus();
    document.getElementById("errorMsg").innerHTML = "Only numeric value is allowed";
    return false;
  }
  return true; // allow submit
}
#errorMsg { color:red }
<form onsubmit="return validate(this)">
  <input type="text" name="quantity" value="" />
  <input type="submit" />
</form>
<span id="errorMsg"></span>

于 2012-06-05T09:56:29.677 回答
0

在我的经验中

document.getElementById(frmObj.id).focus();

在 PC 上运行的浏览器上很好。但是在移动设备上，如果您希望显示键盘以便用户可以直接输入，那么您还需要：

document.getElementById(frmObj.id).select();

于 2020-10-07T12:22:43.487 回答
0

在输入标签内，您可以为使用 jsx/react 的任何人添加 autoFocus={true}。

<input
 type="email"
 name="email"
 onChange={e => setEmail(e.target.value)}
 value={email}
 placeholder={"Email..."}
 autoFocus={true}
/>
于 2020-12-06T14:35:49.113 回答