使用jQuery的validate对提交的表单进行验证

89463661 2020-01-03

1、将校验规则写到控件中

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<script src="https://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script>
<script src="https://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
<script src="https://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>
<script>
$.validator.setDefaults({
    submitHandler: function() {
      //验证通过后执行这里
      alert("提交事件!");
    }
});
$().ready(function() {
    $("#commentForm").validate();
});
</script>
<style>
.error{
    color:red;
}
</style>
</head>
<body>
<form class="cmxform" id="commentForm" method="get" action="">
  <fieldset>
    <legend>输入您的名字，邮箱，URL，备注。</legend>
    <p>
      <label for="cname">Name (必需, 最小两个字母)</label>
      <input id="cname" name="name" minlength="2" type="text" required>
    </p>
    <p>
      <label for="cemail">E-Mail (必需)</label>
      <input id="cemail" type="email" name="email" required>
    </p>
    <p>
      <label for="curl">URL (可选)</label>
      <input id="curl" type="url" name="url">
    </p>
    <p>
      <label for="ccomment">备注 (必需)</label>
      <textarea id="ccomment" name="comment" required></textarea>
    </p>
    <p>
      <input class="submit" type="submit" value="Submit">
    </p>
  </fieldset>
</form>
</body>
</html>

必填项未填写

使用jQuery的validate对提交的表单进行验证

必填项不符合输入规则：

使用jQuery的validate对提交的表单进行验证

验证通过：

 使用jQuery的validate对提交的表单进行验证

89463661

89463661

相关推荐

jQuery validate验证表单隐藏域

function validInfoForm(){ return $.validate({ ignore : "",//验证隐藏域,解决切换标签后隐藏域无法验证问题 rules: { oldPassword: { requi

tztzyzyz / 0评论 2020-07-20

MySQL密码政策

有时候，只是为了自己测试，不想密码设置得那么复杂，譬如只想设置root的密码为123456。SET PASSWORD FOR ‘root‘@‘localhost‘ = PASSWORD;ERROR 1819 : Your password does not

pengpengflyjhp / 0评论 2020-05-31

Golang validate验证器

p=5

wujingsheng0 / 0评论 2020-05-15

jQuery Validate增加手机号码验证

}, "请正确填写您的联系电话");

ELEMENTS爱乐小超 / 0评论 2020-05-11

yum安装mysql

yum -y install mysql57-community-release-el7-10.noarch.rpm yum安装rpm安装包。yum -y install mysql-community-server 开始安装MYSQL的服务器。ALTER

tanyhuan / 0评论 2020-04-18

使用jQuery的validate对提交的表单进行验证

<legend>输入您的名字，邮箱，URL，备注。

89463661 / 0评论 2020-04-14

解决 [Element Warn][Form]model is required for validate to work!

<el-form :model="form" ref="form" :rules="rules" label-position="left" label-width=&q

ELEMENTS爱乐小超 / 0评论 2020-01-17

jquery validate默认校验规则

、remote:"remote-valid.jsp" 使用ajax方法调用remote-valid.jsp验证输入值。、date:true 必须输入正确格式的日期，日期校验ie6出错，慎用。、ac

81463166 / 0评论 2020-01-09

mysql 修改密码策略

alter user ‘root‘@‘localhost‘ identified by ‘1234‘;

翡翠谷 / 0评论 2019-12-12

mysql5.7安装细节

alter user ‘root‘@‘localhost‘ password expire never;（可选）

azhou / 0评论 2019-12-02

jquery validate验证方法

}, "只能由英文字母或数字组成");required: "用户名不能为空",minlength: "请输入3-15个字节",

摄郎Elements / 0评论 2014-04-10

【LeetCode】98. Validate Binary Search Tree

Given a binary tree, determine if it is a valid binary search tree .The left subtree of a node contains only nodes with keysless

zangdaiyang / 0评论 2019-10-28

httprunner学习21-正则表达式提取(extract)与校验(validate)

有些接口返回的并不是json格式的内容，返回的是html或者xml格式的内容，这种就不能用前面的 content.的方法去提取了。httprunner 支持正则表达式提取参数，也支持正则表达式校验。接下来我要提取html里面的 <title>上

eroshn / 0评论 2019-10-19

jquery validate 常用配置

$.validate9: meta设置meta来封装验证规则$.validate

阿尔卑斯山 / 0评论 2014-11-07

jQuery Validate验证框架详解

、remote:"remote-valid.jsp" 使用ajax方法调用remote-valid.jsp验证输入值。、date:true 必须输入正确格式的日期，日期校验ie6出错，慎用。、ac

limengmeng00 / 0评论 2015-09-02

jquery validate 多个复选框

<div class="form-group"><label class="col-sm-3 control-label" for="resids">对应资源：</l

89387046 / 0评论 2017-11-08

Thinkphp5框架使用validate实现验证功能的方法

本文实例讲述了Thinkphp5框架使用validate实现验证功能的方法。分享给大家供大家参考，具体如下：。作为前端er，对于验证这块有着切身的体会，虽然逐渐得心应手，但始终没有一个内置的功能拿来就能用。tp5恰好提供一个。本文简单介绍并实现以下。主要是

sunshao0 / 0评论 2019-08-27

解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法

在使用validate进行表单验证时会有第一次验证通过，但是第二次验证不通过时，第一次验证通过的信息残留在label上面的情况，最常见的就是√残留。此时“请输入姓名”前面应该时×才是正常情况。如何解决这个问题？

屈吉平Elements / 0评论 2019-09-06

jQuery validate

上面定义了一个jQuery函数,形参是$，函数定义完成之后,把jQuery这个实参传递进去.立即调用执行。这样的好处是,我们在写jQuery插件时,也可以使用$这个别名,而不会与prototype引起冲突.这就是一个闭包。return this.optio

PHP基础学习 / 0评论 2018-03-30

Rails 3+之后支持的validate整合写法

validates :name, :presence => { :message => "不能空白" } ,:length => {:minimum => 1, :maximum => 254, :mes

忧郁深蓝 / 0评论 2011-10-19

Eclipse 中不小心点了 Validate 后该怎么办

Eclipse的项目上下文菜单中有一个Validate项，不小心点了这个东西后，不该报错的全部报错了，如何取消呢。1，在project名称上右键选择properties，打开属性窗口，选择左边的validation

markzl / 0评论 2010-06-28

jQuery validate

上面定义了一个jQuery函数,形参是$，函数定义完成之后,把jQuery这个实参传递进去.立即调用执行。这样的好处是,我们在写jQuery插件时,也可以使用$这个别名,而不会与prototype引起冲突.这就是一个闭包。return this.optio

EdwardSiCong / 0评论 2018-03-30

快乐编程-知识分享-Struts1.x学习-validator-003

分享越多，收获越大。* jsp request --> LoginForm validate method --> LoginAction

rumengqiang / 0评论 2012-11-23

jQuery Validate验证框架详解--form表单验证

注意Validate的导入要在jQuery库之后。先导入jQuery库，然后导入Validate插件，如果是中文提示还需要导入messages_zh.js。<script src="messages_zh.js" type=&qu

hackcat / 0评论 2017-03-13

jquery validate 多个相同name的文本框验证

// select all valid inputs inside the form . // select only the first element for each name, and only those with rules specified

yanyiping / 0评论 2017-02-03

jquery validate日期比较方法

//var startDate = jQuery.val() + ":00";补全yyyy-MM-dd HH:mm:ss格式。required: "结束时间不能为空",compareDate: "结束日期必

ndscoylx / 0评论 2016-11-29

validate()验证checkBox

27.},"请正确填写您的手机号码");

娇喘地白菜 / 0评论 2016-09-08

Validate 验证框架详解

默认情况下，验证提示信息用label元素来显示,并且会添加cssclass,通过css可以很方便设置出错控件以及错误信息的显示方式。更进一步可以定义一个组，把几个地方的出错信息统一放在一个地方，用errorPlacement控制把出错信息放在哪里

云海梦尘 / 0评论 2016-09-01

jquery validate的使用

$('#start_item').hide();});<!--table有问题-->. <td><input type="text" name="folderName" style=&q

83510191 / 0评论 2016-06-11

jQuery Validate 验证表达合法性

虽然html5已经支持用required来进行表单验证，但是体验并不是很好，所以还是推荐jQuery Validation来验证，下面是具体的带，为了方便查看，就全部写在一个文件里了。

富贵 / 0评论 2015-11-30

jquery validate异步验证时多参数传递

<label for="firstname" class="col-sm-2 control-label">名称</label>. <button type="submit&q

崔博伦一路有你 / 0评论 2015-09-28

利用jQuery插件uploadPreview实现图片上传以及validate表单验证示例详解

首先给大家介绍我之前遇到的问题，传统的图片上传、展示和防止网页的跳转，大佬们都懂，但是在这里我想简单的写一下我的经历。<form action="//需要上传的路径" method="post" id=&quo

人心 / 0评论 2019-06-27

jquery validate验证插件，在ajax提交方式下的验证

正常的表单都是使用submit按钮来提交，jquery validate插件可以方便的做表单验证。要做一个发送短信的功能，向目标表插入多条记录，界面采用ajax来提交表单，等待效果直接用ext的遮罩了。但是如何验证却碰到问题。解决方式很简单，表单跟正常表单

longshengguoji / 0评论 2015-09-07

jQuery Validate验证框架详解

、remote:"remote-valid.jsp" 使用ajax方法调用remote-valid.jsp验证输入值。、date:true 必须输入正确格式的日期，日期校验ie6出错，慎用。、ac

MMMMMMMay / 0评论 2015-09-02

jquery validate ajax 验证

string=value.match(/0(\d{2,2})-(\d{7,7})/ig);if(string!=null){. returntrue;returnfalse;varflag=1;type:"POST",url:'tel.

adgjlxxx / 0评论 2015-07-22

jQuery validate 失去焦点时验证

为了增加用户体检，把验证改为失去焦点时验证。}把以上代码放入到$.validate({})中即可。

82483564 / 0评论 2015-06-29

jquery validate

写道jQuery(function($) { // 验证 $("#appendinfo").validate( { debug : false, rules : { "user.userName" : { requi

xiyanwushi / 0评论 2015-06-25

jQuery Validate验证框架详解

、remote:"remote-valid.jsp" 使用ajax方法调用remote-valid.jsp验证输入值。、date:true 必须输入正确格式的日期，日期校验ie6出错，慎用。、ac

88463368 / 0评论 2015-06-09

jQuery validate 验证隐藏域(hidden)

要验证隐藏域在validate里面加上一句“ignore:[]”即可，在这里jobIds是隐藏域。username : {required : "不能为空!jobIds : {required : "请选择岗位!});当隐藏域触发验证的

CodeTerminator / 0评论 2015-06-03

(转）封装jQuery Validate扩展验证方法

},"浮点数必须不等于0");

YOKOELEMENT / 0评论 2015-05-05

1、jquery validate表单验证

equalTo: "请再次输入相同的值",

XHQT0 / 0评论 2015-03-23

jquery.validate.js使用之自定义表单验证规则

}, "邮箱格式不对");}, "电话格式如：0371-68787027");}, "区号如：010或0371");}, "不能超过120岁");

jiaojiao0 / 0评论 2015-01-28

jquery validate日期与身份证验证实例

//增加身份证验证function isIdCardNo { var factorArr = new Array; var parityBit = new Array; var varArray = new Array(); var intValue; v

lkj0 / 0评论 2015-01-28

jquery validate addMethod 自定义验证方法

} , "请输入有效的邮政编码");//验证密码 6-18位由字符数字和特殊符号组成 排除空格..

YOKOELEMENT / 0评论 2014-12-17

jquery validate 常用配置

82500798 / 0评论 2014-11-07

jQuery Validate插件为表单提供了强大的验证功能

window.validator = $.validate({ 'errorClass': 'validate_fail', 'onkeyup': false, 'onblur': true, 'errorElement': 'p', 'rules': {

zfjdoreen / 0评论 2014-11-03

parsley.js自定义validate

<!DOCTYPE html>. <script type="text/javascript" src="jquery/jquery-1.11.1.min.js"></script>

linkincsdn / 0评论 2014-10-30

jQuery Validate学习记录

-- ▼引入 jquery validate 相关js -->. 1 required:true 必须输入的字段。2 remote:"check.php" 使用 ajax 方法调用 check.php 验证输入值。4 url:tr

Allenyhy / 0评论 2014-09-06

jquery validate 前端验证框架

jqueryvalidate前端验证框架，真TM有种相见恨晚的感觉，而且是，这种开源的东西，用了以后，之后的学习成本会慢慢降低。瞬间感觉找到了组织，有木有！作为一名程序员，还是要关注开源，奉献开源。但这个版本可能有点滞后，作为参考吧。-- 引入 jquer

oraulvo / 0评论 2014-08-28