Jquery сообщение проверки без использования плагина в

Question

<form action="" method="post" class="a"> 
     Name : <input type="text" class="text" name="name" id="name" /> <br/> 
<span id="sName"></span> 
     Address : <input type="text" class="text" name="address" id="address" /> 
<span id="sAddress"></span> 
<br/> 
     email : <input type="text" class="text" name="email" id="email" /> <br/> 
<span id="sEmail"></span> 
     <input type="button" id="submit" value="Submit" name="submit" /> 
    </form> 

Как отображать сообщения об ошибках в тег диапазона на отправить нажмите

Answer 1

Это один из способов сделать это без использования плагинов (которые лучше, чем пытаться сделать это самостоятельно, потому что они имеют гораздо больше возможностей)

Рабочий код:

$(document).ready(function() { 
 
    var name = $("#name").val(); 
 
    var address = $("#address").val(); 
 
    var email = $("#email").val(); 
 

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

 
     if (name == "") $("#sName").show(); 
 

 
     if (name == "") $("#sAddress").show(); 
 

 
     if (name == "") $("#sEmail").show(); 
 

 
    }); 
 

 

 
});

#sName, #sAddress, #sEmail { 
 
    display: none; 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action="" method="post" class="a">Name : 
 
    <input type="text" class="text" name="name" id="name" /> 
 
    <br/> 
 
<span id="sName">Please enter your name</span> 
 

 
    <br>Address : 
 
    <input type="text" class="text" name="address" id="address" /> 
 
    <br> 
 
<span id="sAddress">Please enter your address</span> 
 

 
    <br>email : 
 
    <input type="text" class="text" name="email" id="email" /> 
 
    <br/> 
 
<span id="sEmail">Please enter your e-mail</span> 
 

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