jQuery验证插件 Validate详解

前端技术 2023/09/08 JavaScript

最常使用JavaScript的场合就是表单的验证,而jQuery作为一个优秀的JavaScript库,也提供了一个优秀的表单验证插件----Validation。Validation是历史最悠久的jQuery插件之一,经过了全球范围内不同项目的验证,并得到了许多Web开发者的好评。作为一个标准的验证方法库,Validation拥有如下特点:

1.内置验证规则: 拥有必填、数字、Email、URL和信用卡号码等19类内置验证规则
2.自定义验证规则: 可以很方便地自定义验证规则
3.简单强大的验证信息提示: 默认了验证信息提示,并提供自定义覆盖默认的提示信息的功能
4.实时验证: 可能通过keyup或blur事件触发验证,而不仅仅在表单提交的时候验证

validate.js下载地址: http://plugins.jquery.com/project/validate
metadata.js下载地址: http://plugins.jquery.com/project/metadata
使用方法:
1.引入jQuery库和Validation插件

url:\"url\",
        comment:\"required\",
        valcode: {
          formula: \"7+9\" 
        }
      }
    });
  });
  </script>

因为默认的提示是英文的,可以改写成

url:\"url\",
        comment:\"required\",
      },
      errorElement:\"em\",
      success:function(label){
        label.text(\" \").addClass(\'success\')
      }
    });

相对应的css

url:\"url\",
        comment:\"required\",
        valcode: {
          formula: \"7+9\" 
        }
      },
      messages:{
        username:{
          required:\"主人,我要填的满满的\",
          minlength:\"哎唷,长度不够耶\"
        }
      },
      errorElement:\"em\",
      success:function(label){
        label.text(\" \").addClass(\'success\')
      }
    });

这里就可以啦。

关于自定义验证规则

增加一段HTML代码

url:\"url\",
        comment:\"required\",
        valcode: {
          formula: \"7+9\" 
        }
      },
      messages:{
        username:{
          required:\"主人,我要填的满满的\",
          minlength:\"哎唷,长度不够耶\"
        }
      },
      errorElement:\"em\",
      success:function(label){
        label.text(\" \").addClass(\'success\')
      }
    });

额。。没了 学的不深,这是基础的一部分。。还会继续深入学习去。掰掰( ^_^ )/~~拜拜

本文地址:https://www.stayed.cn/item/21208

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。