web-dev-qa-db-ja.com

jqueryフォーム要素のタイプ、名前、値を取得する方法

を使用して名前と値の関係を取得できることを知っています

$(#form).serializeArray();

しかし、1回の呼び出しでエンチラーダ全体、タイプ、名前、値を取得する方法はありますか?

12
PruitIgoe

$("form :input")を使用する

docs ごと:

説明:すべてのinput、textarea、select、およびbutton要素を選択します。

今あなたの質問に、

1回の呼び出しでエンチラーダ全体、タイプ、名前、値を取得する方法はありますか?

単にアイテムをループしたい場合は、

_$("form :input").each(function(index, Elm){
  //Do something amazing...
});
_

ただし、ある種の構造体を返したい場合は、.map()を使用できます。

_var items = $("form :input").map(function(index, Elm) {
    return {name: Elm.name, type:Elm.type, value: $(Elm).val()};
});
_

または、単に要素を取得したい場合

_$("form :input").get()
_


jsfiddleでのこの例

22
Mark Coleman

以下のコードは、フォームIDを持つ特定のフォームから要素の詳細を取得するのに役立ちます。

$('#formId input, #formId select').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
):

以下のコードは、読み込みページに配置されているすべてのフォームから要素の詳細を取得するのに役立ちます。

$('form input, form select').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
):

以下のコードは、要素がタグ内に配置されていない場合でも、読み込みページに配置されている要素の詳細を取得するのに役立ちます。

$('input, select').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
):

注:以下のように、オブジェクトリストに必要な要素タグ名を追加します。

Example: to get name of attribute "fieldset",

$('input, select, fieldset').each(
    function(index){  
        var input = $(this);
        alert('Type: ' + input.attr('type') + 'Name: ' + input.attr('name') + 'Value: ' + input.val());
    }
):
4
Srinivasan.S

すべてのフォーム要素を取得するには、

$('input, textarea, select').each(function() {
    //   $(this).attr('type');
    //   $(this).attr('name');
    //   $(this).val();
});
2
Bot

フォームの各input要素をループして、そこから取得したデータを使用できますか?このようなもの:

$('form input').each(function(i, v) {
    // Access like this:
    //   $(this).attr('type');
    //   $(this).attr('value');
    //   $(this).attr('name');
});
2
Josh

おそらく children() の方が便利ですが、セレクターを使用しない限り、関心のある要素を自分でフィルター処理する必要があります。

フォーム内の successful 要素のみを選択する場合は、次のようにすることもできます。これには、ボタンや無効なフィールドは含まれません。

$($('#testf').serializeArray()).each(function(index, value){
    $('#testf [name="' + value.name + '"]'); //select the named element
});

マークの答えは、IMOの最善の方法のようです。

0