jquery validate 小demo

方便学习:

直接上代码:

ceshi.html:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery validation ceshi</title>
<script src="lib/jquery-1.8.3.js" type="text/javascript"></script>
<script src="dist/jquery.validate.min.js"></script>
<script src="dist/additional-methods.min.js"></script>
<script src="localization/messages_zh.js"></script>
<script type="text/javascript">
$(function() {
$.ajaxSetup({
cache:false // 关闭ajax的相应缓存
})
$("#commentForm").validate({
rules:{
loginName:{required:true,remote: 'ceshi.json'}
},
messages:{
loginName:{remote:"登录名已被占用,请更换"}
}
});
});
</script>
<style>
label.error{
color:red;
font-size:12px;
}
</style>
</head>
<body>
<form class="cmxform" id="commentForm" method="get" action="">
<fieldset>
<legend >填写表单,进行测试</legend>
<p>
<label for="cname">Name名称 (required, at least characters)</label>
<input id="cname" name="loginName" minlength="" required type="text" />
<p>
<label for="cemail">E-Mail邮箱 (required)</label>
<input id="cemail" name="email" type="email" required />
</p>
<p>
<label for="curl">URL地址 (optional)</label>
<input id="curl" name="url" value="" type="url" />
</p>
<p>
<label for="ccomment">简介(required)</label>
<textarea id="ccomment" name="comment" required></textarea>
</p>
<p>
<button class="submit" type="submit">提交</button>
</p>
</fieldset>
</form>
</body>
</html>

ceshi.json:

false

直接从官网:http://bassistance.de/jquery-plugins/jquery-plugin-validation/

down下来文件夹基本相同,对应一下文件路径就可以了....

上一篇:jQueryMobile控件之复选框


下一篇:嵌入式系统基础知识(一): 系统结构和嵌入式Linux