Как проверить простую веб-форму

Question

Im работает над небольшой формой и использует js для проверки, являются ли поля пустыми или нет. У меня есть класс пролета рядом с полем имени «имя»«email».

Для «имени» поля , у меня есть класс с именем диапазона «ошибкой».

Для поля «email», у меня есть другой класс span, называемый «error2».

Что я могу сделать, чтобы использовать только один класс для отображения «сообщение об ошибке», потому что, конечно, у меня будет больше поля, и я не хочу добавлять дополнительные классы. error3, error4

HTML:

<form action="#i" name="myForm" onsubmit="return(validate());"> 
    Name: <span id="error"></span><br> 
    <input type="text" name="Name" /><br><br> 

    EMail: <span id="error2"></span><br> 
    <input type="text" name="EMail" /><br> <br> 

    <input type="submit" value="Submit" /> <br> 
    </form> 

JS:

function validate() 
    { 
    var t = 0;  
    if(document.myForm.Name.value == "") 
    { 
     document.getElementById('error').innerHTML = "<br>Empty"; 
     t = 1; 
    } 

    if(document.myForm.EMail.value == "") 
    { 
     document.getElementById('error2').innerHTML = "<br>Empty"; 
     t = 1; 
    } 

    if(t == 1) 
    { 
     return false; 
    } 
    else 
     return true; 
    } 

Answer 1

Вместо того чтобы дать пролетах атрибут Id, классы используют вместо этого. Так, например, вы можете определить все ваши пролеты следующим образом:

<span class="error"> ... </span> 

Затем в функции валидации, вы можете получить эти пролеты через:

document.getElementsByClassName('error'); 

Имейте в виду, однако, это возвращает массив , что на самом деле идеально подходит для вашей функции. Таким образом, вы можете написать базовый цикл для прохождения каждого пролета и убедиться, что каждое поле заполнено правильно.