js校验字段工具(可批量)

在前端校验时,需要对每个输入框都进行校验,需要一个个写点击事件,所以将这部分代码提取成统一方法,参数为json,格式为

批量校验

字段id:对应内容

eg.

var param = {
    "linkName":"经办人姓名",
    "certificateCode":"经办人身份证号",
    "linkMobile":"手机号码",
    "linkPhone":"固定号码",
    "linkEmail":"电子邮箱"
}

批量校验的原理是对每个需要校验的控件设置同样的事件,做出同样的响应吗,所以在使用时需要告诉程序每个字段代表的内容,供提示使用

/**
 * 批量添加点击事件,并且校验非空
 * @param param json
 */
var batchBlurAndVaildIsNotNull = function (param) {
    var ids = "";
    for (var key in param) {
        ids += "#" + key + ",";
    }
    ids = ids.substr(0, ids.length - 1);
    $(ids).blur(function () {
        $(this).next("p").remove();
        var fieldVal = $.trim($(this).val());
        if (!!!fieldVal) {
            $(this).parent().append("

" + param[$(this).attr("id")] + "不能为空

"); } }); }

独立校验

传入id和name,可对单独字段进行校验,

var vaildFieldIsNotNull = function (id, fieldName) {
    $("#" + id).next("p").remove();
    var isNotNull = true;
    var fieldVal = $.trim($("#" + id).val());
    if (!!!fieldVal) {
        $("#" + id).parent().append("

" + fieldName + "不能为空

"); isNotNull = false; } return isNotNull; }

radio校验

radio的获取值方式和一般input控件有一定区别,是通过name获取,所以需要不同的方法

/**
 * 校验Radio是否为空。tip:name有特殊字符时需使用\\转义.
 * @param name input name
 * @param fieldName 字段名
 * @returns {boolean}
 */
var vaildRadioIsNotNull = function (name, fieldName) {
    $("input[name='" + name + "']").next("p").remove();
    var isNotNull = true;
    var fieldVal = $.trim($("input[name='" + name + "']").val());
    if (!!!fieldVal) {
        $("input[name='" + name + "']").parent().append("

" + fieldName + "不能为空

"); isNotNull = false; } return isNotNull; }

radio批量

var vaildRadiosIsNotNull = function (param) {
    var isNotNull = true;
    for (var key in param) {
        isNotNull = vaildRadioIsNotNull(key, param[key]);
    }
    return isNotNull;
}

你可能感兴趣的:(前端)