專注於按鈕後面的下一個表單元素

Question

如何關注點擊後的下一個文本區域？

http://jsfiddle.net/infatti/GmPCz/

$('.add').click(function(){ 
    $(this).closest('div').next('textarea:visible').focus(); 
}); 

Answer 1

closest()開始與當前元素和向上搜索用於選擇器相匹配的第一元素的DOM。你想要的div不是鏈接的祖先，而是兄弟姐妹。

http://jsfiddle.net/8TVxd/

$('.add').click(function(){ 
    $(this).next('div').find('textarea:visible:first').focus(); 
}); 

Answer 2

這應做到：

$(this).next().find('textarea').filter(':visible').first().focus(); 

jsFiddle updated

採用.filter(':visible')和.first()，而不是把它放置在選擇是出於性能的考慮。它避免了必須執行額外的查詢，因爲它只是從最初的單個查詢中減少現有的結果集。

Example explanation of the performance difference。

Answer 3

嘗試找到下一個div並專注於第一個可用textarea。此外，確保覆蓋錨標籤的默認行爲與preventDefault()：

$('.add').click(function(event){ 
    event.preventDefault(); 
    $(this).next('div').find('textarea:visible').first().focus(); 
}); 

JSFiddle