SoFunction
Updated on 2025-02-28

jQuery implements form verification example for user registration


<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="../script/jquery-1.4."></script>
<script>
$(function(){
$(":").each(function(){
var $required = $("<strong>*</strong>");
$(this).parent().append($required);
});
$(":").blur(function(){
//Judge who the mouse left
if($(this).is("#username")){
$(".formtip").remove();
//Verify according to the username rules
if(==""||<6){
var errMsg = "<span class='formtip'>username is at least 6 letters</span>";
$(this).parent().append(errMsg);
}else{
var msg = "<span class='formtip'>username can be used</span>";
$(this).parent().append(msg);
}
}
//Judge if it is email, you should verify it according to the email rules
if($(this).is("#email")){
$(".emailtip").remove();
//Check according to email rules
var reg = /^\w{1,}@\w+\.\w+$/;
var $email = $("#email").val();
if(!($email)){
var errMsg = "<span class='emailtip'>Emailbox is illegal</span>";
$(this).parent().append(errMsg);
}else{
var Msg = "<span class='emailtip'>Emailbox can be used</span>";
$(this).parent().append(Msg);
}
}
});


})
</script>
</head>

<body>
<form action="#" method="post">
<div class="int">
Username:<input type="text" name="username" class="required"/>
</div>
<div class="int">
Email:<input type="text" class="required"/>
</div>
<div class="int">
Profile:<input type="text" class="required"/>
</div>
<input type="submit" value="submit" /><input type="reset" />
</form>
</body>
</html>