テキストボックスを反復する

Question

これらのボックスのidが1から20までのテキストボックスがあります。これらのボックスは、PHP forループで作成されます。 これらのテキストボックスが空の場合はどうすればjavascriptを使用してチェックできますか？各ボックスにエラーを投げる。

foreach(i = 0, i<20, i++) 
{ 
<input type = "Text" id="q_i"> 
} 

Answer 1

jQueryを使用しますか？ （容易になるのjQueryを使用して）jQueryをなし

$('[id^="q_"]').each(function(){if ($(this).val() == '') alert("Your Message Here");}); 

Answer 2

を：他の入力がある場合に

$('input[type=text]').each(function(){if ($(this).val() == '') alert("Your Message Here");}); 

か、あなたは処理しない

foreach(i = 0, i<20, i++) 
{ 
    if (document.getElementById('q_' + i).length == 0) { 
    alert('box ' + i + 'is empty!'); 
    } 
} 

Answer 3

document.getElementsById('q_'+i)[0].value.length > 0 

forループでは大雑把に行うべきです。

（プロジェクトにjQueryを落としても、おそらくより良い計画だろう）

次にあなたがクラスを反復処理することができます。すなわち

foreach(i = 0, i<20, i++) 
{ 
<input type = "Text" id="q_i" class="q"> 
} 

とあなたのJavaScriptで：

$("q").each(function(index,object){ 
    if(object.value().length <= 0) alert('empty!'); 
}); 

Answer 4

Hereはあなたが空を離れるときにそれが現れ見えないエラーメッセージを使用しています 探しているものかもしれない基本的なフォーム検証でありますフィールドをクリックします。空白は使用できません。あなたはそれを複数回検証することができ、それが を期待通りにここでjQueryの一部です動作します。

$(document).ready(function() { 
       $("button").click(function() 
       { $('span[id^=q_]').addClass("hidden"); 
        $('input[id^=q_]').each(function() 
        {if ($(this).val().replace(/ /g,'') == '') 
         { $("#"+$(this).attr('id')).removeClass("hidden"); 
         } 
       }); 
       }); 
}); 

HTML部分：

<style>.hidden{display:none;} 
     .visible{display:block;} 
</style> 
<span id="q_1" class="hidden">Missing text</span> 
<input type = "Text" id="q_1"> 

非常にきれいではありませんが、それは仕事