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 Ajax 带返回值
Aug 01 Javascript
Node调试工具JSHint的安装及配置教程
May 27 Javascript
深入探寻javascript定时器
Jan 02 Javascript
Shell脚本实现Linux系统和进程资源监控
Mar 05 Javascript
原生js与jQuery实现简单的tab切换特效对比
Jul 30 Javascript
JavaScript中获取HTML元素值的三种方法
Jun 20 Javascript
详细谈谈javascript的对象
Jul 31 Javascript
JavaScript和jQuery获取input框的绝对位置实现方法
Oct 13 Javascript
js实现文字无缝向上滚动
Feb 16 Javascript
mint-ui 时间插件使用及获取选择值的方法
Feb 09 Javascript
Vue组件开发技巧总结
Mar 04 Javascript
Rollup处理并打包JS文件项目实例代码
May 31 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
初学者入门:细述PHP4的核心Zend
2006/09/05 PHP
Oracle 常见问题解答
2006/10/09 PHP
PHP4 与 MySQL 数据库操作函数详解
2006/10/09 PHP
Yii2框架数据库简单的增删改查语法小结
2016/08/31 PHP
Js切换功能的简单方法
2010/11/23 Javascript
extjs两个tbar问题探讨
2013/08/08 Javascript
JQuery判断子iframe何时加载完成解决方案
2013/08/20 Javascript
零基础搭建Node.js、Express、Ejs、Mongodb服务器及应用开发入门
2014/12/20 Javascript
JavaScript跨平台的开源框架NativeScript
2015/03/24 Javascript
自定义刻度jQuery进度条及插件
2015/09/02 Javascript
原生JavaScript实现Ajax的方法
2016/04/07 Javascript
JavaScript数据结构之单链表和循环链表
2017/11/28 Javascript
Vue props用法详解(小结)
2018/07/03 Javascript
JS实现根据详细地址获取经纬度功能示例
2019/04/16 Javascript
JavaScript实现tab栏切换效果
2020/03/16 Javascript
[04:09]2014DOTA2国际邀请赛Ti西雅图 历届冠军相继出局 BBC综述今日比赛
2014/07/20 DOTA
[52:12]FNATIC vs Infamous 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
Django读取Mysql数据并显示在前端的实例
2018/05/27 Python
详解Python安装scrapy的正确姿势
2018/06/26 Python
PyQt5内嵌浏览器注入JavaScript脚本实现自动化操作的代码实例
2019/02/13 Python
python跨文件使用全局变量的实现
2020/11/17 Python
CSS3制作翻转效果_动力节点Java学院整理
2017/07/11 HTML / CSS
CSS3属性 line-clamp控制文本行数的使用
2020/03/19 HTML / CSS
Hotels.com加拿大:领先的在线住宿网站
2018/10/05 全球购物
PHP引擎php.ini参数优化深入讲解
2021/03/24 PHP
计算机专业优秀大学生自我总结
2014/01/21 职场文书
《将心比心》教学反思
2014/04/08 职场文书
个人租房协议书
2014/04/09 职场文书
学校党的群众路线教育实践活动总结材料
2014/10/30 职场文书
深入开展党的群众路线教育实践活动心得体会
2014/11/05 职场文书
2016年三严三实党课学习心得体会
2016/01/06 职场文书
导游词之扬州大明寺
2019/10/09 职场文书
mysql部分操作
2021/04/05 MySQL
使用Python+OpenCV进行卡类型及16位卡号数字的OCR功能
2021/08/30 Python
纯CSS如何禁止用户复制网页的内容
2021/11/01 HTML / CSS
MySQL中order by的使用详情
2021/11/17 MySQL