<!DOCTYPE html>

<html>

  <head>

    <meta http-equiv="Content-Type" content="text/html; charset=ANSI"/>

    <title>Validation2</title>

    <script src="../Scripts/jquery-2.1.3.js"></script>

    <script src="../Scripts/jquery.metadata.js" type="text/javascript"></script>

    <script src="../Scripts/jquery.validate.js" type="text/javascript"></script>

    <script type="text/javascript">

      $(function(){

         $("#commentForm").validate({ meta : "validate" });

      });

    </script>

    <style type="text/css">

      *{font-family: Verdana; font-size:96%;}

      label{width: 10em; float: left;}

      label.error{float: none; color: red; padding-left: .5em; vertical-align: top;}

      p {clear: both;}

      .submit{margin-left: 12em;}

      em{font-weight: bold; padding-right: 1em; vertical-align: top;}

    </style>

  </head>

  <body>

    <form class="cmxform" id="commentForm" method="get" action="#">

      <fieldset>

        <legend>一个简单的验证带验证提示的评论例子</legend>

        <p>

           <label for="cusername">姓名</label><em>*</em>

           <input id="cusername" name="username" size="25" class="{validate: {required:true,minlength:2}}" />

        </p>

        <p>

           <label for="cemail">电子邮件</label><em>*</em>

           <input id="cemail" name="email" size="25" class="{validate:{required:true,email:true}}" />

        </p>

        <p>

           <label for="curl">网址</label><em>&nbsp;</em>

           <input id="curl" name="url" size="25" value="" class="{validate:{url:true}}" />

        </p>

        <p>

          <label for="ccoment">你的评论</label><em>*</em>

          <textarea id="ccoment" name="comment" cols="22" class="{validate:{required:true}}"></textarea>

        </p>

        <p>

           <input class="submit" type="submit" value="提交"/>

        </p>

      </fieldset>

    </form>

  </body>

</html>
    本人JS菜鸟，今天按照书本写代码，用jquery.metadata.js进行验证，结果失败了。调试多次，代码也检查一致，发现仍不能成功。后经大神指教调试，终于找到问题。
    原来是规则“空格”闯的祸，在获取规则的时候是按空格进行分割的，因此找不到规则了。
 
         
 
   修改如下：
         

 
       然后结果就可以出来了：
             
      看来还是要好好看看源码

【jQuery】jquery.metadata.js验证失效的更多相关文章

  1. JQuery Validate - 自定义js验证

    (function (window, $) { var validResult = {}; var checkObjs = { /** * 检查输入的一串字符是否全部是数字 * 输入:str Stri ...

  2. jQuery Validate 表单验证插件----利用jquery.metadata.js将校验规则直接写在class属性里面并定义错误信息的提示

    一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.metadata.js 并把校验规则写在控件里面 ...

  3. jQuery插件 -- 表单验证插件jquery.validate.js, jquery.metadata.js

    原文地址:http://blog.csdn.net/zzq58157383/article/details/7718352   最常使用JavaScript的场合就是表单的验证,而jQuery作为一个 ...

  4. jQuery插件 -- 表单验证插件jquery.validate.js

    最常使用JavaScript的场合就是表单的验证,而jQuery作为一个优秀的JavaScript库,也提供了一个优秀的表单验证插件----Validation.Validation是历史最悠久的jQ ...

  5. jQuery Validate验证框架详解(jquery.validate.min.js)

    原博客 jQuery Validate验证框架详解 jQuery校验官网地址:https://jqueryvalidation.org/ 一.导入js库 <script type="t ...

  6. JS验证控件jQuery Validate

    jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证 ...

  7. jQuery validate 根据 asp.net MVC的验证提取简单快捷的验证方式（jquery.validate.unobtrusive.js）

    最近在学习asp.netMVC,发现其中的验证方式书写方便快捷,应用简单,易学好懂. 验证方式基于jQuery的validate 验证方式,也可以说是对jQuery validate的验证方式的扩展, ...

  8. jQuery Validate 表单验证插件----通过name属性来关联字段来验证，改变默认的提示信息，将校验规则写到 js 代码中

    一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.validate.messages_cn.js. ...

  9. aspx中的表单验证 jquery.validate.js 的使用 以及 jquery.validate相关扩展验证(Jquery表单提交验证插件)

    这一期我们先讲在aspx中使用 jquery.validate插件进行表单的验证, 关于MVC中使用 validate我们在下一期中再讲     上面是效果,下面来说使用步骤 jQuery.Valid ...

随机推荐

  1. SMARTFORMS 字段格式化设置

    [转自http://lz357502668.blog.163.com/blog/static/16496743201273153434564/] 在SMARTFORM 输出的时候有时候会遇到数字类型无 ...

  2. Bootstrap学习5--bootstrap中的模态框（modal，弹出层）

    bootstrap中的模态框(modal),不同于Tooltips,模态框以弹出对话框的形式出现,具有最小和最实用的功能集. 务必将模态框的 HTML 代码放在文档的最高层级内(也就是说,尽量作为 b ...

  3. STM32 ~ 串口DMA通道查找

    STM32F4XX: /**************************************************************************************** ...

  4. Android FrameLayout单帧布局

    FrameLayout:所有控件位于左上角,并且直接覆盖前面的子元素. 在最上方显示的层加上: android:clickable="true" 可以避免点击上层触发底层. 实例: ...

  5. 经典c语言题

    1. 用预处理指令#define 声明一个常数,用以表明1年中有多少秒(忽略闰年问题) #define SECONDS_PER_YEAR (60 * 60 * 24 * 365)UL 2. 写一个“标 ...

  6. 每天一个Linux命令（31）diff命令

    diff命令在最简单的情况下,比较给定的两个文件的不同.如果使用“-”代替“文件”参数,则要比较的内容将来自标准输入.diff命令是以逐行的方式,比较文本文件的异同处.如果该命令指定进行目录的比较,则 ...

  7. JVM - 堆外内存

    看了不少资料,总结下: 堆外内存 / 直接内存(Direct Memory)JDK1.4中引入的NIO类,基于channel和Buffer的I/O方式,可用Native库直接分配堆外内存,然后利用一个 ...

  8. css判断iphoneX、iphoneXs、iphoneXs Max、iphone XR

    //iphoneX.iphoneXs @media only screen and (device-width: 375px) and (device-height: 812px) and (-web ...

  9. android6.0 外部存储设备插拔广播以及获取路径（U盘）【转】

    本文转载自:https://blog.csdn.net/zhouchengxi/article/details/53982222 这里我将U盘作为例子来说明解析. android4.1版本时U盘插拔时 ...

  10. 算法（Algorithms）第4版 练习 2.1.1

    E A S Y Q U E S T I O N A E S Y Q U E S T I O N A E S Y Q U E S T I O N A E E Y Q U S S T I O N A E ...