jQuery動態聚焦於第一個INPUT或Textarea

Question

這是一個棘手的開始一個早晨。

我有一系列的圖標。當你點擊一個圖標時，它會加載一個表單。一些表單有輸入[文本]其他人有textareas。

我在想什麼是jQuery，一旦我加載的形式，我可以運行，將...聚焦在第一個輸入或textarea無論它可能是動態的，所以我不需要如果塊。

想法？

Answer 1

這應該這樣做，我認爲

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

Answer 2

編輯

這實際上並沒有很大的溶液中。下面的Patricia's和Onkelborg的解決方案更加優雅。

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

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

else { 
    $firstInput.focus(); 
} 

Answer 3

一些代碼將是很好的..但這個應該很容易。

假設你加載你的到，你知道的id一個div ....

所有你需要做的是一樣的東西

​​

已加載後您的形式

Answer 4

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

:input選擇器抓取所有輸入，textarea，選擇和按鈕元素。

Answer 5

這：

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

＃形式-id爲形式的ID; ：輸入選擇任何輸入和textarea元素; ：啓用確保輸入是可編輯的; ：viisble確保元素可見; ：第一是明顯

Answer 6

它爲我工作負載事件。

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

Answer 7

因爲：可見是一個jQuery擴展且不部分CSS 說明書，使用查詢：可見不能利用由本機DOM querySelectorAll（） 方法提供的 性能提升。要在使用時達到最佳性能：選擇 元素可見，請首先使用純CSS選擇器選擇元素，然後使用.filter（「：visible」）選擇 。

使用，而不是：

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

或：

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

的同時也要記住使用.focus()

試圖將焦點設置到一個隱藏的元素時，會導致錯誤 Internet Explorer。注意僅在可見的 元素上使用.focus（）。要在元素的焦點未設置 時運行元素的焦點事件處理程序，請使用.triggerHandler（「focus」）而不是 .focus（）。

Answer 8

這是我的解決方案。該代碼應該很容易遵循，但這裏的理念是：

• 得到所有的輸入，選擇和文字區域
• 過濾掉所有按鈕和隱藏字段
• 過濾器才啓用，可見字段
• 選擇第一個
• 焦點所選字段

的代碼：

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(); 
} 

然後只需調用focusFirst與您的父元素或選擇器。

選擇：

focusFirst('#parentId'); 

元素：

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

Answer 9

這裏有一種對@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. 
}) 

不完全是OP的問題，但也應該適應純jQuery的情況。