如何循環遍歷表單中的所有元素jQuery

我只是想知道循環表單的所有子元素的最佳方式是什麼？我的表單包含輸入和選擇元素。如何循環遍歷表單中的所有元素jQuery

目前我有：

success: function(data) { 
       $.each(data.details, function(datakey, datavalue) { 
        $('#new_user_form > input').each(function(key, value) { 
         if($(this).attr('id') == datakey) { 
          $(this).val(datavalue); 
         } 
        }); 
       }); 
      }

通過表單的輸入元素這隻環，雖然，我想包括選擇元素太：

我曾嘗試：

$('#new_user_form > input, #new_user_form > select').each(function(key, value) {

但這不起作用。有誰知道爲什麼會發生這種情況？謝謝！

來源

2013-01-02 devoncrazylegs

正常工作對我來說：http://jsfiddle.net/ G8tjU /你應該顯示錶單的HTML。 – JJJ

我們需要看到HTML。 – scoota269

大約從:input選擇jQuery的頁面：

因爲：輸入一個jQuery擴展和不CSS規範的一部分，使用查詢：輸入不能利用由本地DOM提供的性能提升querySelectorAll（）方法。要在使用以下內容時實現最佳性能：輸入選擇元素，首先使用純CSS選擇器選擇元素，然後使用.filter（「：input」）。

這是最好的選擇。

$('#new_user_form *').filter(':input').each(function(){ 
    //your code here 
});

來源

2013-01-02 10:44:32 Ohgodwhy

邏輯是好的，但最初的選擇是錯誤的。您正在過濾表單元素。要使用過濾器函數，您需要執行'#new_user_form *'之類的操作，以便僅過濾輸入元素。 – scoota269

@ scoota269哎呀，我忘了星號。我的錯！ – Ohgodwhy

這工作正常。謝謝！ – devoncrazylegs

$('#new_user_form :input')應該是你的前進方向。請注意省略了>選擇器。有效的HTML表單不允許輸入標籤是表單標籤的直接子元素。

來源

2013-01-02 10:45:14 scoota269

會發生什麼，如果你是這樣的： -

$('#new_user_form input, #new_user_form select').each(function(key, value) {

參考LIVE DEMO

來源

2013-01-02 10:52:41

$('#new_user_form').find('input').each(function(){ 
    //your code here 
});

來源

2013-01-02 10:57:34

這確實有效。如果你想獲得選擇和textareas以及：$（'＃new_user_form'）。find（'input，textarea，select'）。each（function（）{ //你的代碼在這裏 }）; – mpemburn

純JavaScript並不難：

for(var i=0; i < form.elements.length; i++){ 
    var e = form.elements[i]; 
    console.log(e.name+"="+e.value); 
}

注：因爲形式.elements是一個對象for-in循環無法按預期工作。

答案發現here (by Chris Pietschmann)，記錄在案here (W3S)。

來源

2013-08-16 09:48:41

如從#jquery Freenode的IRC信道採取：

$.each($(form).serializeArray(), function(_, field) { /* use field.name, field.value */ });

由於@Cork的頻道上。

來源

2015-03-18 10:33:25

如果您擁有所有表單的偵聽器，這是一個完美的解決方案。這是我的情況：$（'body'）。on（'submit'，'form'，function（e）{e.preventDefault（）; $ .each（$（this）.serializeArray（），function ，object）{console.log（object）}）;}）;'謝謝！ – Albert

回調的第一個參數是索引，所以它應該是：'$ .each（$（form）.serializeArray（），function（index，field）{}）;' 仍然Upvoting :) –

我使用：

$($('form').prop('elements')).each(function(){ 
    console.info(this) 
});

它似乎醜陋，但對我來說仍是更好的方式來獲得所有jQuery元素。

來源

2015-08-12 09:06:52 romuleald

我發現這個簡單的jQuery片段，是爲方便選擇只是我想與之合作的選擇的類型：

$("select, input").each(function(){ 
    // do some stuff with the element 
});

來源

2016-12-20 18:02:50 Phil

如何循環遍歷表單中的所有元素jQuery

回答

相關問題