常用库

$(document).ready(function() {
    $(document).on('show.bs.modal', '.modal', function() {
        var zIndex = 1040 + (10 * $('.modal:visible').length);
        $(this).css('z-index', zIndex);
        setTimeout(function() {
            $('.modal-backdrop').not('.modal-stack').css('z-index', zIndex - 1).addClass('modal-stack');
        }, 0);
    });
});

表单验证

官方https://github.com/jaywcjlove/validator.js

var validator = new Validator('form1',[
            {
                name: 'openid',
                display:"不能为空|必须正数",
regexp_num:/^[0-9]+$/,
                rules: 'required|regexp_num'
            }
        ],function(obj,evt){
            if(obj.errors.length>0){
                var error_str = '';
                for (var i = 0; i < obj.errors.length; i++) {
                    error_str =obj.errors[i].message;
 obj.errors[i].element.setAttribute('style', 'border:1px solid red')
                   alert(error_str);return false;
                }
            }
        })

validator.validate();//验证失去焦点
- `name` -> input 中 `name` 对应的值
- `display` -> 验证错误要提示的文字 `{{这个中间是name对应的值}}` 
- `rules` -> 一个或多个规则(中间用`|`间隔)

    - `is_email` -> 验证合法邮箱
    - `is_ip` -> 验证合法 ip 地址
    - `is_fax` -> 验证传真
    - `is_tel` -> 验证座机
    - `is_phone` -> 验证手机
    - `is_url` -> 验证URL
    - `is_money` -> 金额格式验证
    - `is_english` -> 字母验证
    - `is_chinese` -> 中文验证
    - `is_percent` -> 验证百分比
    - `required` -> 是否为必填
    - `max_length` -> 最大字符长度
    - `min_length` -> 最小字符长度
    - `same(field)` -> 指定字段内容是否相同
    - `different(field)` -> 拒绝与某个字段相等,比如登录密码与交易密码情况
    - `contains(field)` -> 直接判断字符串是否相等
    - `accepted(field)` -> 用于服务条款,是否同意时相当有用,不限制checkbox与radio,有可能submit button直接附带value情况

{
    //name 字段
    name: 'email',
    display:"你输入的不{{email}}是合法邮箱|不能为空|太长|太短",
    // 验证条件
    rules: 'is_email|max_length(12)'
    // rules: 'valid_email|required|max_length(12)|min_length(2)'
}

作者：Yoby 创建时间：2020-07-22 21:30
更新时间：2024-12-05 13:26

weui

js图标库

animate动画库

swiper4

侧滑

bootstarp

表单验证