您的位置:首页 > 其它

简单实用的反馈表单无刷新提交带验证

2013-11-15 00:00 537 查看
js文件可以查看源码

XML/HTML Code
<div id="preview"></div> 
<div id="formbox"> 
<form name="form" id="form" action="submit.php" method="post"> 
<ul id="ngothastyle3" > 
<li> 
<label>Name</label> 
<input type="text" name="name" class="" maxlength="40" /> 
</li> 
<li> 
<label>Email</label> 
<input type="text" name="email" class="" maxlength="100" /> 
</li> 
<li> 
<label>Message</label> 
<textarea name="message" rows="5" cols="45" class=""></textarea> 
</li> 
<li> 
<label> </label> 
<input type="submit" value="Submit"> 
</li> 
</ul> 
</form> 
</div>

JavaScript Code
<script type="text/javascript"> 
$('document').ready(function(){ 

$('#form').validate({ 
rules:{ 
"name":{ 
required:true, 
maxlength:40 
}, 

"email":{ 
required:true, 
email:true, 
maxlength:100 
}, 

"message":{ 
required:true 
}}, 

messages:{ 
"name":{ 
required:"This field is required" 
}, 

"email":{ 
required:"This field is required", 
email:"Please enter a valid email address" 
}, 

"message":{ 
required:"This field is required" 
}}, 

submitHandler: function(form){ 
$(form).ajaxSubmit({ 
target: '#preview', 
success: function() { 
$('#formbox').slideUp('fast'); 
} 
}); 

} 

}) 

}); 
</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: