表单验证器

最新推荐文章于 2023-05-11 17:51:49 发布
最新推荐文章于 2023-05-11 17:51:49 发布
阅读量342 收藏
点赞数 1
分类专栏： web 前台 js web 前台html 文章标签： html Html HTML 表单验证器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fffgggzzz/article/details/8562977
版权
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
   
    <title>fangz 表单验证器</title>
 <meta http-equiv="pragma" content="no-cache">
 <meta http-equiv="cache-control" content="no-cache">
 <meta http-equiv="expires" content="0">   
 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
 <meta http-equiv="description" content="This is my page">
 <!--
 <link rel="stylesheet" type="text/css" href="styles.css">
 -->
 <style type="text/css">
  .inputBoder{border: 2px solid red;}
 </style>
 <script type="text/javascript" src="formJs/jquery.js"></script>
 <script type="text/javascript" src="formJs/validateForm.js"></script>
 <script type="text/javascript">
  
 </script>
  </head>
 
  <body>
    <form action="index.html" οnsubmit="return Validator.validateForm(document.forms[0])" method="post">
     <table width="100%">
      <tr>
       <td width="10%">姓名</td>
       <td width="95%">
        <input type="text" id="name" value="" require="true"/>
        <span id="nameSpan" style="color: red;">*</span>
       </td>
      </tr>
      <tr>
       <td width="10%">密码</td>
       <td width="95%">
        <input type="text" id="pwd" value="" require="true"/>
        <span id="pwdSpan" style="color: red;">*</span>
       </td>
      </tr>
      <tr>
       <td width="10%">重复密码</td>
       <td width="95%">
        <input type="text" id="repwd" value="" dataType="Repeat" toId="pwd" msg="两次密码不一致!"/>
        <span id="repwdSpan" style="color: red;">*</span>
       </td>
      </tr>
      <tr>
       <td width="10%">年龄</td>
       <td width="90%">
        <input type="text" id="age" value="" dataType="Integer" msg="年龄只能输入数字!"/>
        <span id="ageSpan" style="color: red;"></span>
       </td>
      </tr>
      <tr>
       <td width="10%">手机号码</td>
       <td width="90%">
        <input type="text" id="moblie" value="" maxlength="12" dataType="Moblie" msg="手机号码格式不正确!"/>
        <span id="moblieSpan" style="color: red;"></span>
       </td>
      </tr>
      <tr>
       <td width="10%">email</td>
       <td width="90%">
        <input type="text" id="email" value="" dataType="Email" msg="您输入的Email格式不正确!"/>
        <span id="emailSpan" style="color: red;"></span>
       </td>
      </tr>
      <tr>
       <td width="10%">身份证</td>
       <td width="90%">
        <input type="text" id="idCard" value="" dataType="IdCard" maxlength="18" msg="您输入的身份证有误!"/>
        <span id="idCardSpan" style="color: red;"></span>
       </td>
      </tr>
      <tr>
       <td width="10%">中文</td>
       <td width="90%">
        <input type="text" id="chiness" value="" dataType="Chinese" msg="真实姓名只允许中文!"/>
        <span id="chinessSpan" style="color: red;"></span>
       </td>
      </tr>
      <tr>
       <td width="10%">英文</td>
       <td width="90%">
        <input type="text" id="english" value="" dataType="English" msg="英文名只允许英文字母"/>
        <span id="englishSpan" style="color: red;"></span>
       </td>
      </tr>
      <tr>
       <td width="10%">爱好</td>
       <td width="90%">
        <input type="checkbox" name="aiHao" value="1"/>游泳
        <input type="checkbox" name="aiHao" value="2"/>打球
        <input type="checkbox" name="aiHao" value="3" dataType="Group" min="2" max="2" msg="只能选择2个" require="true"/>跑步
        <span id="aiHaoSpan" style="color: red;">*</span>
       </td>
      </tr>
      <tr>
       <td width="10%">url</td>
       <td width="90%">
        <input type="text" name="Url" id=Url value="" dataType="Url" msg="您输入的网址格式不正确!"/>
        <span id="UrlSpan" style="color: red;"></span>
       </td>
      </tr>
      <tr>
       <td width="10%">double</td>
       <td width="90%">
        <input type="text" name="Double" id=Double value="" max="2" dataType="Double" msg="只能两位小数!"/>
        <span id="DoubleSpan" style="color: red;"></span>
       </td>
      </tr>
      <tr>
       <td width="10%">Length</td>
       <td width="90%">
        <input type="text" name="Length" id=Length value="" min="2" max="2" dataType="ValueLength" msg="只能输入两位!"/>
        <span id="LengthSpan" style="color: red;"></span>
       </td>
      </tr>
      <tr>
       <td colspan="4">
        <input type="submit" value="提交"/>
        <a href=" http://www.youweishop.com">有为商城</a>
     <a href=" http://download.csdn.net/detail/fffgggzzz/5046171">下载地址</a>
       </td>
      </tr>
     </table>
    </form>
  </body>
</html>
fangz
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
验证器：React表单验证器
02-16
Coderan：验证器 智能React元素验证器 介绍 这个软件包的目的是通过一个简单的系统来简化React中验证元素的工作，该系统允许用户添加自己的规则。 该系统直接与DOM中的元素通信，因此与其他库（如广泛兼容。 这个概念 验证器由两个主要元素组成，一个Area和一个Provider 。 区域是一种包装，具有需要作为子元素进行验证的元素。 区域扫描基础组件和元素并索引可验证的元素。 另一方面，提供者是围绕区域的包装器，并允许它们之间进行通信。 为了与其他区域的值匹配，需要进行此通信。 它也可以用于一次验证所有区域，并防止在并非所有区域都有效时采取措施。 如何使用 首先，首先要向验证器添加规则以使用它们。 有一些预先制定的规则，但是您必须创建自己的更具体的规则。 import { Validator } from '@coderan/validator' ; import { min
js的表单验证器
米 柴的博客
07-01 181
js表单验证
后端注册表单验证器实现
最新发布
Krien666的博客
05-11 104
视图函数在去注册用户之前需要进行验证，表单验证需要先下载 flask-wtf
表单_验证器
不怕猫的耗子z
09-12 297
常用验证器 1、在验证某个字段的时候，可以传递一个validators参数用来指定验证器，进一步对数据进行过滤 2、Django自带验证器有很多，但是很多验证器我们其实已经通过对应的Field或者一些参数就可以指定了 ⑴比如EmailValidator，我们可以通过EmailField来指定 ⑵比如MaxValueValidator，我们可以通过max_value参数来指定 3、以下是一些常用的验证器： 验证器名 描述 MaxValueValidator 验证最大...
表单验证器：从Brad Traversy学习表单验证器
02-26
形式验证器 通过HTML，CSS和JavaScript学习和练习表单验证器
form-validator:一个轻量级的纯 JavaScript 表单验证器
06-05
form-validator a lightweight pure javascript form validator 遵循ecmascript5，兼容IE9+，配合jQuery可以兼容IE6+。 ##用法 首先为需要添加验证规则的dom元素添加自定义属性rg-rule，属性值为**|**分隔开的规则名称。 如果想设置错误提示可以添加**rg-msg-{ruleword}**属性，设置对应规则的提示语。rg-msg-all表示设置默认提示语，除已设置提示语的错误类型外都将使用此提示语。 然后就可以在js里调用validator.Form方法new一个验证对象出来了。 var valid = new validator.Form({ form:dom, //包含需要验证的一组dom元素的dom元素。可以是jQuery对象 target: dom, // }, alert);
validator-表单验证神器
JackieDYH的博客
06-07 6924
一个字符串验证和过滤库，能够做到我们常规应用开发中各种验证方式，比如是否包含某个字符串，字符串的长度类型等等，完全能满足我们日常的前端开发，并且还可以在服务端使用
vue 自定义表单验证器
潇湘子的博客
08-05 1969
1.首先我们自己新建一个 validatorUtils.js 文件来存放我们项目中所有的校验器 内容可以是： /** * 校验使用: message: 自定义信息，extra: 对象, 额外传递的参数 */ /** * 是否必须 * @param {*} rule * @param {*} value * @param {*} callback */ export function validateRequire(rule, value, callback) { if (!value &a
Angular表单验证器
weixin_33908217的博客
12-13 344
为什么使用验证器 用户输入的数据各式各样,并不总是正确的,如果用户输入了错误的数据格式,那么我们希望给他们提供实时正确的反馈,并且阻止表单的提交.因此,我们需要验证器来处理这些情况. 表单验证 Angular支持的内置validate属性： required- 设置表单控件值是非空的 email - 设置表单控件的格式是email ...
form——验证器Validators
weixin_34348805的博客
01-22 471
form表单最大的作用就是验证功能了，通过cleaned_data清洗，我们可以获取传来的值，通过参数、验证器、自定义验证方法，我们可以做到很多的验证。 验证器可用于在不同类型的字段之间重用验证逻辑。validators有自带的验证器，也可以自己定义一个验证器。在验证某个字段的时候，可以传递一个validators参数用来指定验证器，进一步对数据进行过滤。验证器...
php ci框架 自动验证,CodeIgniter.CI框架整合Thinkphp5.0.TP5.0表单验证器.....非常实用的表单验证器!...
weixin_31466565的博客
03-20 237
下面我们就来说说在CI框架上如何整合TP5验证器!验证器文件所在位置:[thinkphp\library\think\Validate.php]复制这个文件然后就是在CI的操作:3.在CI项目目录:application\libraries 下面新建Validate文件夹.把从TP5复制的验证器文件放到这里面去.4.然后在:application\config\autoload.php.设置验证器...
SpringMVC表单验证器
Java技术栈，分享最主流的Java技术
01-08 1048
本章讲解SpringMVC中怎么通过注解对表单参数进行验证。 SpringBoot配置 使用springboot，spring-boot-starter-web会自动引入hiberante-validator,validation-api依赖。 在WebMvcConfigurerAdapter实现类里面添加验证器及国际化指定资源文件。 @Override public Valida
validate表单校验器
qq_44063001的博客
02-26 382
使用： 1.导入jquery.js文件 2.导入jquery-validate.js文件 3.导入messages_zh.js国际化文件(可以不导入的) 4.对表单进行校验 在页面加载成功后获取表单对象.validate({ rules:{}, //校验规则 messages:{} //自定义提示信息 }) rules写法： 不要写id,是name 要校验的...
使用Laravel的表单验证器
qq_40945903的博客
08-30 241
1、使用默认的验证信息 $rules = [ 'phone' => 'required' ]; $validator = Validator::make($request->all(), $rules); if ($validator->fails()) { $message = $validator->errors()->first(); return new JsonResponse(['code' => '10501', 'msg' =&
vue 表单验证rule用法及验证器validator使用
热门推荐
盛夏~冰糖的博客
04-30 2万+
目录1.表单验证1.1rule用法1.2validator用法1.3整体代码 1.表单验证 1.1rule用法 注意：表单必须绑定rules验证规则才能生效 //绑定数据、绑定规则 //注意表单项的prop要和数据对应 <el-form :model="user" :rules="rules" status-icon label-width="100px" class="userForm" ref="use
Angular2 自定义表单验证器
SmileSB101-(ZXB)的博客
02-09 4306
废话 最近由于项目上需要用到表单验证，前面直接通过 (input) 事件进行数据检查，但是不好和自带的验证器统一，而且也不正统。于是打算研究一下自定义验证器，网上类似的文章很多，但是自己在实现的过程中还是遇到了一些问题。于是还是啰嗦的自己写一篇文章。 正文 这里有官方文档：验证响应式表单，用户的视觉提示，自定义验证器，这篇文章是根据这些文档所来（前面两者就不再赘述比较简单，也说的比较清楚...
打印js错误信息
02-04 5083
http://www.w3.org/1999/xhtml" > 标题页 function getError() {     try     {      x =new test;                        //产生错误     }     catch(e)     {        document.write(e.description)
鼠标移到下拉框时自动全部打开
02-04 1043
标题页 世界第一等 亚洲第一山 世界第一海 http://www.youweishop.com">有为商城
Enter键将光标移到下个输入框
02-15 914
Enter键将光标移到下个输入框               if(event.keyCode==13)event.keyCode=9"> if(event.keyCode==13)event.keyCode=9"> if(event.keyCode==13)event.keyCode=9"> http://www.youweishop.com">有为商城
JavaScript 读取、写入Txt文档
03-12 869
JS操作文本文件 var arr = new Array(); arr[0] = [0,"name0","value0"]; arr[1] = [1,"name1","value1"]; arr[2] = [2,"name2","value2"]; arr[3] = [3,"name3","value3"]; arr[4] = [4,"name4","value4"];
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值