微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

baigoValidator 文件结构:使用方法: jQuery表单验证插件

程序名称:baigoValidator 文件结构:使用方法:

授权协议: GPL

操作系统: 跨平台

开发语言: JavaScript

baigoValidator 文件结构:使用方法: 介绍

baigovalidator 是基于 jQuery
的表单验证插件在线演示

文件结构:

  1. baigovalidator.js 验证插件

  2. baigovalidator.css CSS 样式

  3. status_x.png 验证失败时的图标

  4. status_y.png 验证成功时的图标

  5. loading.gif 正在验证图标

  6. readme.txt 使用说明

使用方法

  1. 载入 jQuery 库文件,jQuery 库文件请到 http://www.jquery.com 下载,例:
    <script src="jquery.js" type="text/javascript"></script>
    

载入 baigovalidator 样式表,例:

    <link href="baigovalidator.css" type="text/css" rel="stylesheet" />

载入 baigovalidator 核心文件,例:

    <script src="baigovalidator.js" type="text/javascript"></script>
  1. 初始化 baigovalidator,fileds_set 为配置参数,类型为 JSON,名称可以自定义,例:

    <script type="text/javascript">$(document).ready(function(){
    obj_form = $("#form_id").baigovalidator(fileds_set);
    

    });

  2. 配置参数,具体请参考 配置参数说明,例:

    <script type="text/javascript">var fileds_set = {
    name: {
        length: { min: 1, max: 100 },
        validate: { type: "str", format: "text" },
        msg: { id: "msg_prj_status", too_short: "太短", too_long: "太长" }
    },
    no: {
        length: { min: 4, max: 4 },
        validate: { type: "str", format: "int" },
        msg: { id: "msg_prj_status", too_short: "太短", too_long: "太长" }
    },
    email: {
        length: {min: 1, max: 0 },
        validate: { type: "str", format: "email" },
        msg: { id: "msg_prj_status", too_short: "太短" }
    },
    digit: {
        length: { min: 1, max: 0 },
        validate: { type: "digit", format: "int" },
        msg: { id: "msg_prj_status", too_short: "太短" }
    },
    checkBox: {
        length: { min: 1, max: 0 },
        validate: { type: "checkBox" },
        msg: { id: "msg_prj_status", too_few: "太少" }
    },
    user_name: {
        length: { min: 1, max: 0 },
        validate: { type: "ajax" },
        msg: { id: "msg_prj_status", too_few: "太少" }
        ajax: { url: "http://www.nbfone.com/ajax/", key: "user_name", "type" : "str" }
    }
    

    }

  3. 定义需要验证的字段 id 或 group,此处需与 配置参数 中的定义一致,例:

    <input type="text" id="name" /><input type="checkBox" id="name" group="test" />
    
  4. 定义需要验证的表单项的 class,class 的值必须为 validate,例:

    <input type="text" id="name" class="validate" /><input type="text" id="name" group="test" class="validate" />
    
  5. 触发验证,例:

    <script type="text/javascript">var obj_form = $("#cate_form").baigovalidator(fileds_set);$("#cate_form").submit(function(){
    obj_form.validateSubmit();
    

    });

baigoValidator 文件结构:使用方法: 官网

http://www.baigo.net/jquery/baigovalidator.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐