フォームの要素をJavascriptでループする方法は？

Question

私はフォームを持っており、入力フィールドをループして空白であるかどうかをチェックしたいが、どのようにループを作るのか分からない。私は空白部分を確認する方法を知っている。私はループの助けが必要です。ここに私のフォームは次のとおりです。

<form method="POST" action="submit.php"> 
    <input type="text" value="1"> 
    <input type="text" value="2"> 
    <input type="text" value=""> 
    <input type="text" value="4"> 
    <input type="text" value="45"> 
    <input type="text" value="5"> 
    <input type="text" value="6"> 
    <input type="text" value="1"> 
    <input type="text" value="3"> 
    <input type="text" value="6"> 
    <input type="text" value="5"> 

    <button type="submit">Submit</button> 
</form> 

Answer 1

あなたはgetElementsByTagName機能を使用することができ、それは与えられたタグ名を持つ要素のHTMLCollectionを返します。

var elements = document.getElementsByTagName("input") 
for (var i = 0; i < elements.length; i++) { 
    if(elements[i].value == "") { 
     alert('empty'); 
     //Do something here 
    } 
} 

DEMO

また、あなたはあなたがあなたのフォームの参照を取得する必要があり、その後のことができますフォーム

DEMO with form Name

Answer 2

を前年同期比ために名前を与えている提供document.myform.getElementsByTagNameを使用することができますelementsコレクションを繰り返します。だから、例えば仮定：

<form method="POST" action="submit.php" id="my-form"> 
    ..etc.. 
</form> 

次のようなものがあります：

var elements = document.querySelectorAll("#my-form input[type=text][value='']") 

そして、あなた：ブラウザであなたもような何かを行うことができquerySelectorAllサポートすること

var elements = document.getElementById("my-form").elements; 

for (var i = 0, element; element = elements[i++];) { 
    if (element.type === "text" && element.value === "") 
     console.log("it's an empty textfield") 
} 

はお知らせelementsには、空の値属性を持つ要素だけが含まれます。ただし、ユーザーによって値が変更された場合、属性は変わらないため、このコードはオブジェクトのプロパティではなく属性でフィルタリングすることにのみ注意してください。もちろん、2つのソリューションを混在させることもできます。

var elements = document.querySelectorAll("#my-form input[type=text]") 

for (var i = 0, element; element = elements[i++];) { 
    if (element.value === "") 
     console.log("it's an empty textfield") 
} 

基本的にチェックを1つ保存します。

Answer 3

$(function() { 
    $('form button').click(function() { 
     var allowSubmit = true; 
     $.each($('form input:text'), function(index, formField) { 
      if($(formField).val().trim().length == 0) { 
       alert('field is empty!'); 
       allowSubmit = false; 
      } 
     }); 
     return allowSubmit; 
    }); 
}); 

DEMO