JS/JQUERY函数库

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS/JQUERY函数库相关的知识,希望对你有一定的参考价值。

1. 判断字符串是否为空

技术分享
function isEmptyString(str) {
    return str == undefined || str == "" || str == null;
}
View Code

2. 判断数据格式

2.1 判断是否邮箱格式

技术分享
function isEmail(str) {
    var re = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$");
    return re.test(str);
}
View Code

2.2 判断是否整数格式

技术分享
function isInt(str) {
    var re = new RegExp("^-?[0-9]+$");
    return re.test(str);
}
View Code

2.3 判断是否浮点数字格式

技术分享
function isFloat(str) {
    var re = new RegExp("^-?[0-9]+\.[0-9]+$");
    return re.test(str);
}
View Code

3. 获取object中属性的值

技术分享
function getObjectData(object, field) {
    var fieldArray = field.split(".");
    var childObj = object;
    $.each(fieldArray, function(i, n) {
        childObj = childObj[n];
    })
    return childObj;
}
View Code

例如:

var test = {a:"aaa",b:{c:"ccc",d:{e:"eee",f:"fff"}}};

var testResult = getObjectData(test,"a.b.d.f");

获得到的testResult的值为"fff"。

4. 扩展日期类型,增加格式化功能

技术分享
Date.prototype.Format = function(fmt) {
    var o = {
        "M+" : this.getMonth() + 1,
        "d+" : this.getDate(),
        "h+" : this.getHours(),
        "m+" : this.getMinutes(),
        "s+" : this.getSeconds(),
        "q+" : Math.floor((this.getMonth() + 3) / 3),
        "S" : this.getMilliseconds()
    };
    if (/(y+)/.test(fmt))
        fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    for ( var k in o)
        if (new RegExp("(" + k + ")").test(fmt))
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
    return fmt;
}
View Code

5. 设定整个页面的keyPress事件响应

技术分享
function setGloableKeyPress(keyCode, onKeyPress) {
    document.onkeydown = function(e) {
        var ev = document.all ? window.event : e;
        if (ev.keyCode == keyCode) {
            onKeyPress();
        }
    }
}
View Code

6. form表单功能扩展

6.1 表单输入元素中回车响应

技术分享
$.fn.formAutoSearch = function(onSearch) {
    var id = $(this).attr("id");
    $("#" + id + " :input").not(‘:button, :submit, :reset‘).keypress(function(e) {
        if (e.keyCode == 13) {
            onSearch();
        }
    })
}
View Code

6.2 检测表单输入合法性(需要html元素属性支持)

技术分享
$.fn.formCheck = function(funMsg) {
    var rtn = true;

    var id = $(this).attr("id");
    var inputs = $("#" + id + " :input").not(‘:button, :submit, :reset‘);
    $.each(inputs, function(i, n) {
        var caption = $(this).attr("caption");

        var maxLength = $(this).attr("maxlength");
        if (isEmptyString(maxLength) == false) {
            var val = "";
            if ($(this).is("input")) {
                val = $(this).val();
            } else if ($(this).is("textarea")) {
                val = $(this).html();
            }
            if (val.length > parseInt(maxLength)) {
                if (funMsg != undefined) {
                    funMsg(caption + "输入长度超过限制");
                }
                rtn = false;
            }
        }
        var notNull = $(this).attr("notnull");
        if (notNull == "true") {
            var val = "";
            if ($(this).is("input")) {
                val = $(this).val();
            } else if ($(this).is("textarea")) {
                val = $(this).html;
            } else if ($(this).is("select")) {
                val = $(this).val();
            }
            if (val.length == 0) {
                if (funMsg != undefined) {
                    funMsg("请填写" + caption);
                }
                rtn = false;
            }
        }
        var chkEmail = $(this).attr("isemail");
        if (chkEmail == "true") {
            var val = "";
            if ($(this).is("input")) {
                val = $(this).val();
            } else if ($(this).is("textarea")) {
                val = $(this).html;
            }
            if (isEmail(val) == false) {
                if (funMsg != undefined) {
                    funMsg("您填写的" + caption + "不是有效的邮箱格式,请重新填写");
                }
                rtn = false;
            }
        }
        var chkNum = $(this).attr("isint");
        if (chkNum == "true") {
            val = $(this).val();
            if (isInt(val) == false) {
                if (funMsg != undefined) {
                    funMsg("您填写的" + caption + "不是有效的数字格式,请重新填写");
                }
                rtn = false;
            }
        }
        var chkFloat = $(this).attr("isfloat");
        if (chkFloat == "true") {
            val = $(this).val();
            if (isFloat(val) == false) {
                if (funMsg != undefined) {
                    funMsg("您填写的" + caption + "不是有效的数字格式,请重新填写");
                }
                rtn = false;
            }
        }
    });
    return rtn;
}
View Code

6.3 清除表单

技术分享
$.fn.formClear = function() {
    var id = $(this).attr("id");
    var inputs = $("#" + id + " :input").not(‘:button, :submit, :reset‘);
    $.each(inputs, function(i, n) {
        if ($(this).is("input")) {
            if ($(this).attr("type") == "text" || $(this).attr("type") == "hidden" || $(this).attr("type") == undefined) {
                $(this).val("");
            } else if ($(this).attr("type") == "checkbox") {
                $(this).prop("checked", false);
            } else if ($(this).attr("type") == "radio") {
                $(this).prop("checked", false);
            } else if ($(this).attr("type") == "password") {
                $(this).val("");
            }
        } else if ($(this).is("textarea")) {
            $(this).html("");
        } else if ($(this).is("select")) {
            var nid = $(this).attr("id");
            $("#" + nid + " option:first").attr("selected", "selected");
        }
    })
}
View Code

6.4 填充表单

技术分享
$.fn.formFill = function(data) {
    var id = $(this).attr("id");
    var inputs = $("#" + id + " :input").not(‘:button, :submit, :reset‘);
    $.each(inputs, function(i, n) {
        var attr = $(this).attr("name");
        var valStr = getObjectData(data, attr);
        if (valStr == null || valStr == undefined) {
            valStr = "";
        } else {
            valStr = valStr.toString();
        }
        if ($(this).is("input")) {
            if ($(this).attr("type") == "text" || $(this).attr("type") == "hidden" || $(this).attr("type") == undefined) {
                $(this).val(valStr);
            } else if ($(this).attr("type") == "checkbox") {
                $(this).prop("checked", valStr);
            } else if ($(this).attr("type") == "radio") {
                $(this).prop("checked", valStr);
            } else if ($(this).attr("type") == "password") {
                $(this).val(valStr);
            }
        } else if ($(this).is("textarea")) {
            $(this).html(valStr);
        } else if ($(this).is("select")) {
            $(this).val(valStr);
        }
    })
}
View Code

7. css中px的数值操作

7.1 获取css中px的数值

技术分享
$.fn.getCssPx = function(cssProp) {
    var cssStr = $(this).css(cssProp);
    cssStr = cssStr.substr(0, cssStr.length - 2);
    return parseInt(cssStr);
}
View Code

7.2 设定css中px的数值

技术分享
$.fn.setCssPx = function(cssProp, value) {
    $(this).css(cssProp, value + "px");
}
View Code

8. 未完待续

 

以上是关于JS/JQUERY函数库的主要内容,如果未能解决你的问题,请参考以下文章

JQuery引入

jQuery基本语法

常用Javascript代码片段集锦

jQuery知识点整合

Chrome-Devtools代码片段中的多个JS库

Jquery的三章的笔记