여러 텍스트 상자에 대한 자바 스크립트 유효성 검사

Question

js를 사용하여 텍스트 상자의 유효성을 검사하는 방법을 알아 내는데 문제가 있습니다. 나는 10 개의 텍스트 상자를 가지고 있는데, 사용자는 1-10의 숫자를 모두 채울 수 있지만 0을 채울 수는 없다. 여기에 js가있다.하지만 10 개의 텍스트 상자가 모두 채워지면 true를 반환한다. 채우는.

function submitIt() { 
    if (document.isForm.Student_ID.value == null) { 
     alert ("You must enter a Colleague ID."); 
     return false; 
    } else { 
     return true; 
    } 
} 

그리고 여기가 ..... 형태입니다

<form name="isForm" onSubmit="return submitIt()"> 
    <input name="Student_ID" type="text" id="idField1" /> 
    <input name="Student_ID" type="text" id="idField2" /> 
    <input name="Student_ID" type="text" id="idField3" /> 
    <input name="Student_ID" type="text" id="idField4" /> 
    <input name="Student_ID" type="text" id="idField5" /> 
    <input name="Student_ID" type="text" id="idField6" /> 
    <input name="Student_ID" type="text" id="idField7" /> 
    <input name="Student_ID" type="text" id="idField8" /> 
    <input name="Student_ID" type="text" id="idField9" /> 
    <input name="Student_ID" type="text" id="idField10" /> 
    <input name="SUBMIT" type="submit" /> 
</form> 

내가 모든 이름을 변경하고, 각각을 확인할 수 있습니다 실현,하지만 난에 그 많은 혼란을 피하기 위해 노력하고

내 코드, 그리고 호기심이 최선의 방법입니다. 어떤 도움을 주셔서 감사합니다, 감사합니다!

Answer 1

document.getElementsByName으로 모든 텍스트 상자의 모음을 가져올 수 있습니다. 그리고 그들을 통해 루프, 적어도 하나가 채워되어 있는지 확인 :

var allTbs = document.getElementsByName("Student_ID"); 
var valid = false; 
for (var i = 0, max = allTbs.length; i < max; i++) { 
    if (allTbs[i].value) { 
     valid = true; 
     break; 
    } 
} 

DEMO

Answer 2

기능은 학생의 텍스트 상자를 모두에 의해 반복 일부 요소가 작성되어있는 경우 true를 반환한다. 당신이 jQuery를 사용할 수 http://jsfiddle.net/hhD2x/

Answer 3

: 입력 만 공간 :

function submitIt() { 
     for(var i = 0, t = document.getElementsByName("Student_ID"), l = t.length; i < l; i++)  
     if(t[i].value && !/^\s+$/.test(t[i].value)) 
      return true; 

     return false 
    } 

데모에 포함되어있는 경우 그 보호.

function submit() 
{ 
     $('.student').each(function() { 
      if($(this).val() == '' || $(this).val() == null) 
      { 
       // your error message 
       return false; 
      } 

     } 
} 

이 기능은 학생 클래스의 모든 요소를 ​​확인 JS 함수에서 모든 텍스트 상자 즉 지금

<input name="Student_ID" type="text" id="idField1" class="student" /> 

에 대한 일반적인 클래스 이름을 추가합니다.

Answer 4

$('input[type="text"], select, 
    :input[type="date"], 
    :input[type="email"], 
    :input[type="radio"]').each(function() { 

    if ($.trim($(this).val()) == '') { 
    // your error message here 
    isValid = false; 
    } 

});