jquery 聚焦

jQuery 聚焦方法

使用 jQuery 实现元素聚焦可以通过 focus() 方法。该方法触发元素的 focus 事件或绑定一个函数作为事件处理程序。

触发聚焦事件

直接调用 focus() 方法可以让指定元素获得焦点：

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

绑定聚焦事件处理程序

可以为元素的 focus 事件绑定一个函数：

$("#inputField").focus(function() {
  console.log("Input field is focused");
});

动态聚焦新添加的元素

对于动态添加到 DOM 的元素，可以使用事件委托或直接在添加后调用 focus()：

$("#container").on("focus", "input.dynamic", function() {
  console.log("Dynamic input focused");
});

// 或者添加后直接聚焦
$("#container").append('<input type="text" class="dynamic">');
$("#container .dynamic").last().focus();

聚焦第一个符合条件的元素

在表单中聚焦第一个无效的输入字段：

$("input:invalid").first().focus();

延迟聚焦

使用 setTimeout 解决某些浏览器中立即聚焦可能失效的问题：

setTimeout(function() {
  $("#inputField").focus();
}, 0);

注意事项

• 并非所有元素都支持聚焦操作，通常表单控件（input, select, textarea 等）才可聚焦。
• 某些浏览器可能需要在用户交互（如点击事件）后才能成功聚焦。
• 聚焦操作可能因浏览器安全限制在某些场景下失效（如 iframe 中的跨域内容）。