<html>
<head>
<meta charset="utf8"></meta>
</head>
<body>
<script src="http://code.jquery.com/jquery.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<script type="text/javascript">
$().ready(function() {
//$("#signupForm").validate();//不推荐
//此种方式需要将验证规则写在html中 且如果使用 class="{required:true,minlength:5,messages:{required:'请输入内容'}}"
//这样的方式话 还需再添加一个jquery.metadata.js 包 //方式2 将提示信息写入js中
//在验证没有通过之前 插件会自动禁止提交
$("#signupForm").validate({
rules: {
firstname: {
required:true,
remote:{
url:"check-name.php",
type:"get",
data:{
firstname:function(){
return $('input[name="firstname"]').val();
}
},
dataType:"json"
}
},
email: {
required: true,
email: true
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: "#password"
} },
messages: {
firstname: {
required:"请输入姓名",
remote:"换一个"
},
email: {
required: "请输入Email地址",
email: "请输入正确的email地址"
},
password: {
required: "请输入密码",
minlength: jQuery.format("密码不能小于{0}个字 符")
},
confirm_password: {
required: "请输入确认密码",
minlength: "确认密码不能小于5个字符",
equalTo: "两次输入密码不一致不一致"
}
}
});
});
</script> <form id="signupForm" method="get" action="coco.php">
<p>
<label for="firstname">Firstname</label>
<input id="firstname" name="firstname" class="required" />
</p>
<p>
<label for="email">E-Mail</label>
<input id="email" name="email" class="required email" />
</p>
<p>
<label for="password">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="Submit"/>
</p>
</form>
</body> </html>

check-name.php

<?php
$name=$_REQUEST['firstname'];
$valid="";
if($name=="first"){
$valid="false";
}else if($name=="aaa"){
$valid="false";
}else{
$valid="true";
}
echo $valid;
?>

jQuery validate入门的更多相关文章

  1. jquery validate.js表单验证的基本用法入门

    这里转载一篇前辈写的文章,在我自己的理解上修改了一下,仅作记录. 先贴一个国内某大公司的代码: 复制代码 代码如下: <script type="text/javascript&quo ...

  2. JQuery之validate入门

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. 转:jquery validate.js表单验证

    这里转载一篇前辈写的文章,在我自己的理解上修改了一下,仅作记录. 先贴一个国内某大公司的代码: 复制代码代码如下: <script type="text/javascript" ...

  4. day 48 jQuery快速入门

    jQuery快速入门   jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Ev ...

  5. (转)jquery.validate插件的使用

    JQuery Validate使用总结:一.导入js库<script src="../js/jquery.js" type="text/javascript&quo ...

  6. jQuery Validate 表单验证 — 用户注册简单应用

    相信很多coder在表单验证这块都是自己写验证规则的,今天我们用jQuery Validate这款前端验证利器来写一个简单的应用. 可以先把我写的这个小demo运行试下,先睹为快.猛戳链接--> ...

  7. jquery validate表单验证插件-推荐

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  8. 修改 jquery.validate.js 支持非form标签

    尝试使用markdown来写一篇blog,啦啦啦 源代码传送门:github 在特殊情况下我们使用jquery.validate.js对用户输入的内容做验证的时候,表单并不是一定包含在form之中,有 ...

  9. 表单验证插件之jquery.validate.js

    提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): ...

随机推荐

  1. Android Resource介绍和使用

    1. 相关文件夹介绍 文件 取值方式 string.xml getResource().getString(resourceId)或者getResource().getText(resourceId) ...

  2. mac 版本号控制工具SmartSVN7.5.4(破解版)

    SmartSVN7.5.4和破解工具,下载地址:http://download.csdn.net/detail/pearlhuzhu/7407319 操作步骤: 1.在MAC上选中smartsvn-m ...

  3. printf("%d, %d\n", i++, ++i)的输出结果是确定的吗???

    1. 问题描述 以下代码的输出结果是什么? 题目1: ; printf("%d, %d\n", i++, ++i); 题目2: ; printf("%d, %d, %d, ...

  4. org.openqa.selenium.SessionNotCreatedException: A new session could not be created.

    解决方案 1. 重新插拔手机. 2. 检查appium端口是否被占用,如是,杀掉占用了改端口的进程,然后重启appium. 3.

  5. AJAX背景技术介绍

    AJAX全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. 主要包含了以下几种技术: Ajax(A ...

  6. 解决Collection <__NSArrayM: 0x7f8168f7a750> was mutated while being enumerated.'

    当程序出现这个提示的时候,是因为你一边便利数组,又同时修改这个数组里面的内容,导致崩溃,网上的方法如下: NSMutableArray * arrayTemp = xxx; NSArray * arr ...

  7. python初探-数据类型

    数据类型 可以使用BIF type()来查看对象的类型 数字 int float long 布尔(bool) True 机内表示1,机器识别非0 False 机内表示0,机器识别0 空值 None 字 ...

  8. Spring jdbctemplate学习笔记

    /*List<?> config = getDB(" select t.datavalue from sys_config t where t.configid = '15' & ...

  9. android 中获取网络状态、判断3G、2G、wifi网络、判断wifi是否打开、获取本机地址、获取本机串号IMEI整理

    代码如下:package com.android.xym; import java.io.IOException; import java.net.HttpURLConnection; import ...

  10. HortonWorks

    http://zh.hortonworks.com/products/hortonworks-sandbox/