JQuery validate插件Remote用法大全

 更新时间:2016年05月15日 09:14:32   作者:wildfox  
validate是一个基于Jquery的表单验证插件,利用他的remote可以用来自定义远程验证,这篇文章主要介绍了JQuery validate插件Remote用法大全的相关资料,需要的朋友可以参考下

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用法大全的相关知识,希望对大家以上帮助!

相关文章

  • Jquery 实现grid绑定模板

    Jquery 实现grid绑定模板

    这篇文章主要介绍了Jquery 实现grid绑定模板的相关资料,需要的朋友可以参考下
    2015-01-01
  • jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法

    jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法

    这篇文章主要介绍了jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法,涉及jQuery响应鼠标事件动态操作页面元素属性的相关技巧,需要的朋友可以参考下
    2015-11-11
  • jQuery+HTML5实现弹出创意搜索框层

    jQuery+HTML5实现弹出创意搜索框层

    本文主要分享了jQuery+HTML5弹出创意搜索框层的实例代码。具有一定的参考价值,下面跟着小编一起来看下吧
    2016-12-12
  • 自己动手实现jQuery Callbacks完整功能代码详解

    自己动手实现jQuery Callbacks完整功能代码详解

    最近大量的用到jQuery Callbacks 对象,jQuery库中的$.ajax()和$.Deferred() 对象也是基于这个对象实现,下面我们也模拟实现jQuery Callbacks 对象的部分功能
    2013-11-11
  • Jquery实现自定义窗口随意的拖拽

    Jquery实现自定义窗口随意的拖拽

    点击一个按钮时,弹出一个自定义窗口,并且可以随意的拖拽,jquery也可以实现这样的功能,下面有个不错的示例,大家可以感受下
    2014-03-03
  • jquery 遍历hash操作示例【基于ajax交互】

    jquery 遍历hash操作示例【基于ajax交互】

    这篇文章主要介绍了jquery 遍历hash操作,结合实例形式分析了jQuery基于ajax交互获取并遍历hash相关操作技巧,需要的朋友可以参考下
    2019-10-10
  • jquery trigger函数执行两次的解决方法

    jquery trigger函数执行两次的解决方法

    这篇文章主要介绍了jquery trigger函数执行两次的解决方法,详细分析了trigger函数执行两次的原因与响应的解决技巧,非常具有实用价值,需要的朋友可以参考下
    2016-02-02
  • jquery图片切换插件

    jquery图片切换插件

    本文给大家分享的是一则使用jQuery实现图片切换的插件,效果非常不错,兼容性也很好,推荐给大家,有需要的小伙伴快来参考下吧。
    2015-03-03
  • jquery下利用jsonp跨域访问实现方法

    jquery下利用jsonp跨域访问实现方法

    客户端的跨域访问,可以通过jsonp方式来实现,jquery提供了跨域访问的方法,jQuery.ajax()支持get方式的跨域。当然支持跨域还需要服务器端相应的处理。
    2010-07-07
  • jQuery事件与动画超详细讲解

    jQuery事件与动画超详细讲解

    在jquery中,jquery动画事件和动画函数经常用的到,今天小编抽时间给大家整理了些关于常用的jquery动画事件和动画函数,对jquery动画函数和动画事件相关知识感兴趣的朋友一起学习吧
    2022-12-12

最新评论