jQuery动态关注第一个INPUT或Textarea-jQueryDynamicallyfocusonthefirstINPUTorTextarea

59  

This should do it I think

我认为应该这样做

$("#formId input:text, #formId textarea").first().focus();

39  

Here it is:

这里是：

$('#form-id :input:enabled:visible:first').focus();

#form-id is ID of the form; :input selects any input and textarea element; :enabled ensures the input is editable; :viisble ensures that the element is visible; :first is obvious

＃form-id是表单的ID; ：input选择任何input和textarea元素; ：enabled确保输入可编辑; ：viisble确保元素可见; ：首先是显而易见的

10  

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

The :input selector grabs all input, textarea, select and button elements.

：输入选择器获取所有输入，textarea，select和button元素。

9  

some of your code would be nice.. but this should be easy.

你的一些代码会很好..但这应该很容易。

assuming your loading your for into a div that you know the id of....

假设你加载你的div进入你知道的id ...

all you have to do is something like

所有你需要做的就是这样

$('#TheIdOfYourFormDiv').find('input, textarea').first().focus()

after you've loaded your form

在您加载表单后

4  

EDIT

编辑

This is actually not that great of a solution. Patricia's and Onkelborg's solutions below are much more elegant.

这实际上并不是一个很好的解决方案。 Patricia和Onkelborg的解决方案更加优雅。

var $firstInput = jQuery("input:first");
var $firstTextArea = jQuery("textarea:first");

if(firstInput.length == 0) {
  $firstTextArea.focus();
}

else {
  $firstInput.focus();
}

1  

It's working for me in the load event.

它在load事件中对我有用。

$('#Div').find('input:first').focus();

1  

Here is my solution. The code should be easy enough to follow but here is the idea:

这是我的解决方案。代码应该很容易遵循，但这里的想法是：

• get all inputs, selects, and textareas
• 获取所有输入，选择和textareas
• filter out all buttons and hidden fields
• 过滤掉所有按钮和隐藏字段
• filter to only enabled, visible fields
• 过滤到仅启用的可见字段
• select the first one
• 选择第一个
• focus the selected field
• 聚焦所选字段

The code:

代码：

function focusFirst(parent) {
    $(parent).find('input, textarea, select')
        .not('input[type=hidden],input[type=button],input[type=submit],input[type=reset],input[type=image],button')
        .filter(':enabled:visible:first')
        .focus();
}

Then simply call focusFirst with your parent element or selector.

然后只需使用父元素或选择器调用focusFirst。

Selector:

选择：

focusFirst('#parentId');

Element:

元件：

var el = $('#parentId');
focusFirst(el);

1  

Here's A solution for bootstrap modals developed on top of that by @craztmatt and others. I have extended to have the selection of the target element start at the modal that triggered the event. This one catches inputs, textarea AND select elements.

这是由@craztmatt和其他人开发的自助模态解决方案。我已经扩展到在触发事件的模态中选择目标元素。这个捕获输入，textarea和选择元素。

// do this to make bootstrap modals auto-focus.
// delegate to body so that we only have to set it up once.
$('body').on('shown.bs.modal', function (e) {
    var ele = $(e.target).find('input[type=text],textarea,select').filter(':visible:first'); // find the first input on the bs modal
    if (ele) {ele.focus();} // if we found one then set focus.
})

Not precisely the OP's question but should be adaptable to a pure jquery case too.

不完全是OP的问题，但也应该适应纯粹的jquery案例。

0  

Because :visible is a jQuery extension and not part of the CSS specification, queries using :visible cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. To achieve the best performance when using :visible to select elements, first select the elements using a pure CSS selector, then use .filter(":visible").

因为：visible是一个jQuery扩展而不是CSS规范的一部分，使用：visible的查询无法利用本机DOM querySelectorAll（）方法提供的性能提升。要在使用时获得最佳性能：可见选择元素，首先使用纯CSS选择器选择元素，然后使用.filter（“：visible”）。

Use instead:

改为使用：

$('form').filter(':input:first').focus();

or:

要么：

$('input').first().focus(); //as shown in the "correct" answer.

Also bear in mind when using .focus()

使用.focus（）时也要记住

Attempting to set focus to a hidden element causes an error in Internet Explorer. Take care to only use .focus() on elements that are visible. To run an element's focus event handlers without setting focus to the element, use .triggerHandler( "focus" ) instead of .focus().

尝试将焦点设置为隐藏元素会导致Internet Explorer出错。注意只对可见的元素使用.focus（）。要在不将焦点设置到元素的情况下运行元素的焦点事件处理程序，请使用.triggerHandler（“focus”）而不是.focus（）。