好用的jquery.validation

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">本文采用:</span>
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">jquery.validationEngine.js  、jquery-1.10.2.js</span>

基于jquery的表单验证的插件,只是IE6以及以上版本。

实例:

<pre name="code" class="html"><meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<script type="text/javascript" src="jquery-1.10.2.js" ></script>
<script type="text/javascript" src="jquery-1.10.2.min.js" ></script>
<script type="text/javascript" src="js/jquery.validationEngine.js"></script>
<script type="text/javascript" src="js/jquery.validationEngine.min.js"></script>
<script type="text/javascript" src="js/jquery.validationEngine-zh_CN.js"></script>
<link rel="stylesheet" type="text/css" href="css/validationEngine.jquery.css"></link>
 
 


<div>
	<h1>表单验证</h1>	
</div>
<div>
<form id="form_id">
<fieldset style="margin-bottom: 15px;padding: 15px;border: 1px solid #B5B8C8;border-radius: 3px;">
	<legend>开始测试</legend>
	<label style="margin-bottom: 4px;display:block">用户名:</label>
	<input type="text" id="username" style="margin-bottom:10px;width:300px;padding:4px;border:1px solid #B5B8C8;border-radius:3px;background:#FFF;color:#555;font-size:14px;" name="username" class="validate[required] text-input" data-errormessage="* 请填写用户名"/><br/>
	<label style="margin-bottom: 4px;display:block">密码:</label>
	<input type="password" id="password" style="margin-bottom:10px;width:300px;padding:4px;border:1px solid #B5B8C8;border-radius:3px;background:#FFF;color:#555;font-size:14px;" name="password" class="validate[required] text-input" /><br/>
	<input type="submit" id="buttonTest" name="buttonTest" value="注册" />
</fieldset>
</div>
其中
data-errormessage支持自定义验证提示
直接调用:
$funciton(){
$('#form_id').validationEngine(); 
// 自定义参数调用 
$('#form_id').validationEngine('attach', { 
    promptPosition: 'topRight', //定义提示位置
    scroll: false 
}); 
};
效果图:
 
 好用的jquery.validation_第1张图片 
 



你可能感兴趣的:(JavaScript,html,插件)