2014-09-24 125 views
1

好吧,我有multy字段具有相同的名稱,我想檢查是所有字段都不是空的。我的代碼工作,如果我只有一個輸入,但我不知道怎麼做,有更多的投入Js驗證具有相同名稱的multipe輸入字段

<input class = "new_input" type=text name="name[]"/> 
<input class = "new_input" type=text name="name[]"/> 

function validation(){ 

    var x = document.forms["form"]["name"].value; 
    if(x ==='') 
    { 
     $("#warning").html("Morate uneti vrednost!").css('color','red'); 
    return false; 
    } 
    else 
    { 
     return true; 
    } 

} 

例如,如果只輸入一個字段,驗證將工作,我要檢查所有領域

+0

使用相同的類的所有輸入字段,而不是相同的名稱。 – VPK 2014-09-24 12:51:32

回答

0

您已經標記了jQuery,所以我給了一些東西,在jQuery的工作 http://jsfiddle.net/8uwo6fjz/1/

$("#validate").click(function(){ 

    var x = $("input[name='name[]']") 
    $(x).each(function(key,val){ 
    if($(val).val().length<=0) 
    { 
     $("#warning").html("Morate uneti vrednost!").css('color','red'); 

    } 

    }); 

}); 
+0

點擊按鈕後無法使用提交按鈕和表單重新加載 – 2017-06-23 11:52:14

1

只使用JS,你可以做類似

<input class="new_input" type="text" name="name[]"> 
<input class="new_input" type="text" name="name[]"> 
<input class="new_input" type="text" name="name[]"> 
<input class="new_input" type="text" name="name[]"> 
<button onclick="validate()">Validate</button> 

<script type="text/javascript"> 
    function validate() { 
     var inputs = document.getElementsByTagName("input"); 
     var empty_inputs = 0; 
     for(var i = 0; i < inputs.length; i++) { 
      if(inputs[i].name.indexOf('name') == 0) { // check all inputs with 'name' in their name 
       if (inputs[i].value == '') { 
        empty_inputs++; 
        console.log('Input ' + i + ' is empty!'); 
       } 
      } 
     } 

     if (empty_inputs == 0) { 
      console.log('All inputs have a value'); 
     } 
    } 
</script> 
+0

返回false在您的代碼中不起作用 – 2017-06-23 11:57:09

0

試試這個:

function validate(){ 
    var error = 0; 
    $.each($("input[name='name[]']"), function(index,value){ 
     if(value.value.length == 0){ 
      $("#warning").html("Morate uneti vrednost!").css('color','red'); 
      error = 1; 
      return; 
     } 
    }); 
    if(!error){ 
     $("#warning").html(""); 
    } 
} 

看看這裏:jsFiddle

相關問題