JQuery validate插件Remote用法大全


Posted in Javascript onMay 15, 2016

jquery.validate是jquery旗下的一个验证框架,借助jquery的优势,我们可以迅速验证一些常见的输入,还可以自己扩充自己的验证方法,并且对国际化也有很好的支

JQuery.validate.js 在表单验证中经常使用,初学,对于其中Remote的使用说明一下.

. 基本解释

JQuery主要用于DOM树和CSS树的检索和后面的操作的一套方法,JQuery.validate.js是对JQuery的一个插件,可以认为是对JQuery在某个特殊场景下的扩展,而Validate就是对表单验证提供的扩展。

. 场景解释

用户进行注册用户的时候,要异步的判断用户名是否存在,给出提示信息。

. 通过案例学习

Html和JavaScript结合的脚本.

<!DOCTYPE html PUBLIC "-//WC//DTD XHTML . Transitional//EN" "http://www.w.org/TR/xhtml/DTD/xhtml-transitional.dtd">
<html xmlns="http://www.w.org//xhtml">
<head>
<script src="../includes/libraries/javascript/jquery.js" type="text/javascript" charset="utf-" ></script>
<script src="../includes/libraries/javascript/jquery.plugins/jquery.validate.js" type="text/javascript" charset="utf-"></script>
<script type="text/javascript">
$().ready(function() {
$("#signupForm").validate({
debug: false,
onkeyup:false,
/*忽略某些元素不做验证*/
//ignore: ".ignore",
/* 更改错误信息显示的位置
Default:
errorPlacement: function(error, element) { 
error.appendTo(element.parent()); 
} 
error.appendTo(element.parent());
*/
/*
submitHandle: function(form){
alert("submited!");
form.submit();},
*/
rules: {
/*
firstname: { 
required: function(){ return true;}},
*/
firstname: {
required: true,
remote: {
url: "Learn.php",
type: "post",
//DataType: "json",
data: {
firstname: function(){
return $("#firstname").val();
}
}}},
phonenum: {
required: true,
digits: true,
rangelength: [,]},
email: {
required: true,
email: true},
password: {
required: true,
minlength: },
confirm_password: {
required: true,
minlength: ,
equalTo: "#password"}
},
messages: {
firstname: {
required: "请输入姓名",
remote: "请输入姓名,remote"},
phonenum: {
required: "请输入手机号",
digits: "存在字符,非法手机号",
rangelength: "手机号位数不对"},
email: {
required: "请输入Email地址",
email: "请输入正确的email地址"},
password: {
required: "请输入密码",
minlength: jQuery.format("密码不能小于{}个字 符")},
confirm_password: {
required: "请输入确认密码",
minlength: "确认密码不能小于个字符",
equalTo: "两次输入密码不一致不一致"}
},
submitHandler: function(form){
alert("验证通过");} 
});
}); 
</script>
</head>
<body>
<form id="signupForm" method="post" action="">
<p>
<label for="firstname">姓氏</label>
<input id="firstname" name="firstname" />
</p>
<p>
<label for="phonenum">手机</label>
<input id="phonenum" name="phonenum" />
</p>
<p>
<label for="email">邮件</label>
<input id="email" name="email" />
</p>
<p>
<label for="password">密码</label>
<input id="password" name="password" type="password" />
</p>
<p>
<label for="confirm_password">确认密码</label>
<input id="confirm_password" name="confirm_password" type="password" />
</p>
<p>
<input class="submit" type="submit" value="提交"/>
</p>
</form>
</body>
</html>

后台PHP代码 BaseFunction.php

<?php
function WriteLog($msg)
{
$filename = dirname(__FILE__) ."\\Debug.log";
$handler = null;
if (($handler = fopen($filename, 'ab+')) !== false)
{
fwrite($handler, "\n".'['.date('Y-m-d H:i:s').']'."\t".$msg);
fclose($handler);
}
}
function CheckUser($UserName) { 
if( $_REQUEST[$UserName] == 'php' ){
exit("false");
}
else{
exit("true");
}
}
?>

后台PHP代码 Learn.php

<?php
require("BaseFunction.php");
CheckUser('firstname');
?>

以上所述是小编给大家介绍的JQuery validate插件Remote用法大全的相关知识,希望对大家以上帮助!

Javascript 相关文章推荐
简明json介绍
Sep 28 Javascript
javascript GUID生成器实现代码
Oct 31 Javascript
利用jQuary实现文字浮动提示效果示例代码
Dec 26 Javascript
jQuery学习笔记之toArray()
Jun 09 Javascript
后台获取ZTREE选中节点的方法
Feb 12 Javascript
JavaScript事件详细讲解
Jun 27 Javascript
javascript图片预览和上传(兼容IE)
Mar 15 Javascript
javascript+css3开发打气球小游戏完整代码
Nov 28 Javascript
微信小程序tabBar用法实例详解
Dec 04 Javascript
微信小程序云开发之使用云函数
May 17 Javascript
vue 动态表单开发方法案例详解
Dec 02 Javascript
js实现自定义右键菜单
May 18 Javascript
js阻止浏览器默认行为触发的通用方法(推荐)
May 15 #Javascript
Javascript自执行匿名函数(function() { })()的原理浅析
May 15 #Javascript
js阻止浏览器默认行为的简单实例
May 15 #Javascript
js添加绑定事件的方法
May 15 #Javascript
JavaScript绑定事件监听函数的通用方法
May 14 #Javascript
易被忽视的js事件问题总结
May 14 #Javascript
jQuery防止重复绑定事件的解决方法
May 14 #Javascript
You might like
第八节 访问方式 [8]
2006/10/09 PHP
PHP中比较时间大小实例
2014/08/21 PHP
php文件压缩之PHPZip类用法实例
2015/06/18 PHP
php获取当前url地址的方法小结
2017/01/10 PHP
QQ登录简单实现代码
2021/03/09 Javascript
将jQuery应用于login页面的问题及解决
2009/10/17 Javascript
最常用的12种设计模式小结
2011/08/09 Javascript
JS获得浏览器版本和操作系统版本的例子
2014/05/13 Javascript
javascript去除字符串中所有标点符号和提取纯文本的正则
2014/06/07 Javascript
javascript 动态创建表格
2015/01/08 Javascript
jQuery中unwrap()方法用法实例
2015/01/16 Javascript
基于Bootstrap 3 JQuery及RegExp的表单验证功能
2017/02/16 Javascript
Vue学习笔记之表单输入控件绑定
2017/09/05 Javascript
简单谈谈vue的过渡动画(推荐)
2017/10/11 Javascript
ES7之Async/await的使用详解
2019/03/28 Javascript
webpack的tree shaking的实现方法
2019/09/18 Javascript
微信小程序实现Swiper轮播图效果
2019/11/22 Javascript
python中os操作文件及文件路径实例汇总
2015/01/15 Python
Python内置的HTTP协议服务器SimpleHTTPServer使用指南
2016/03/30 Python
Python实现多线程HTTP下载器示例
2017/02/11 Python
Python简单实现Base64编码和解码的方法
2017/04/29 Python
python操作MySQL 模拟简单银行转账操作
2017/09/27 Python
Python实现修改文件内容的方法分析
2018/03/25 Python
Python中文件的读取和写入操作
2018/04/27 Python
python简易远程控制单线程版
2018/06/20 Python
Python使用pickle模块实现序列化功能示例
2018/07/13 Python
Python绘制KS曲线的实现方法
2018/08/13 Python
Python读取系统文件夹内所有文件并统计数量的方法
2018/10/23 Python
Python学习笔记之变量、自定义函数用法示例
2019/05/28 Python
关于不懂Chromedriver如何配置环境变量问题解决方法
2019/06/12 Python
python 申请内存空间,用于创建多维数组的实例
2019/12/02 Python
在ipython notebook中使用argparse方式
2020/04/20 Python
Ellesse英国官网:意大利高级运动品牌
2019/07/23 全球购物
如果重写了对象的equals()方法,需要考虑什么
2014/11/02 面试题
授权委托书样本及填写说明
2014/09/19 职场文书
2015年度物流工作总结
2015/04/30 职场文书