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 相关文章推荐
jQuery获取浏览器中的分辨率实现代码
Apr 23 Javascript
js获取当前页面的url网址信息
Jun 12 Javascript
jQuery读取XML文件内容的方法
Mar 09 Javascript
浅谈Javascript实现继承的方法
Jul 06 Javascript
JavaScript实现自动弹出窗口并自动关闭窗口的方法
Aug 06 Javascript
JavaScript驾驭网页-CSS与DOM
Mar 24 Javascript
JavaScript中的继承之类继承
May 01 Javascript
js省市县三级联动效果实例
Apr 15 Javascript
Javascript别踩白块儿(钢琴块儿)小游戏实现代码
Jul 20 Javascript
JavaScript中使用参数个数实现重载功能
Sep 01 Javascript
Angular实现点击按钮控制隐藏和显示功能示例
Dec 29 Javascript
jQuery实现获取及设置CSS样式操作详解
Sep 05 jQuery
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
在PHP3中实现SESSION的功能(二)
2006/10/09 PHP
PHP仿微信多图片预览上传实例代码
2016/09/13 PHP
TP框架实现上传一张图片和批量上传图片的方法分析
2020/04/23 PHP
FileUpload 控件 禁止手动输入或粘贴的实现代码
2010/04/07 Javascript
合并table相同单元格的jquery插件分享(很精简)
2011/06/20 Javascript
关于query Javascript CSS Selector engine
2013/04/12 Javascript
JavaScript等比例缩放图片控制超出范围的图片
2013/08/06 Javascript
javascript 回到顶部效果的实现代码
2014/02/17 Javascript
学习JavaScript设计模式之状态模式
2016/01/08 Javascript
一道常被人轻视的web前端常见面试题(JS)
2016/02/15 Javascript
vue环境搭建简单教程
2017/11/07 Javascript
php 解压zip压缩包内容到指定目录的实例
2018/01/23 Javascript
Es6 Generator函数详细解析
2018/02/24 Javascript
jQuery实现文件编码成base64并通过AJAX上传的方法
2018/04/12 jQuery
浅谈Python中的zip()与*zip()函数详解
2018/02/24 Python
在python中按照特定顺序访问字典的方法详解
2018/12/14 Python
python 实现读取一个excel多个sheet表并合并的方法
2019/02/12 Python
Python中的asyncio代码详解
2019/06/10 Python
Python3.7实现验证码登录方式代码实例
2020/02/14 Python
解决jupyter运行pyqt代码内核重启的问题
2020/04/16 Python
解决python pandas读取excel中多个不同sheet表格存在的问题
2020/07/14 Python
Python爬虫后获取重定向url的两种方法
2021/01/19 Python
python 模块导入问题汇总
2021/02/01 Python
CSS3 Notes: -webkit-box-reflect实现倒影的实例
2016/12/08 HTML / CSS
英国最大的网上药品商店:Chemist Direct
2017/12/16 全球购物
时尚孕妇装:Ingrid & Isabel
2019/05/08 全球购物
大四学生思想汇报
2014/01/13 职场文书
综治维稳工作承诺书
2014/08/30 职场文书
开平碉楼导游词
2015/02/06 职场文书
2016银行求职自荐信
2016/01/28 职场文书
《葡萄沟》教学反思
2016/02/23 职场文书
创业计划书之家教托管
2019/09/25 职场文书
Nginx安装完成没有生成sbin目录的解决方法
2021/03/31 Servers
手把手教你使用TensorFlow2实现RNN
2021/07/15 Python
Python实现灰色关联分析与结果可视化的详细代码
2022/03/25 Python
mysql数据库如何转移到oracle
2022/12/24 MySQL