让jquery validation plugin 支持zepto

浏览数：68 / 时间：2015年06月09日

做移动端快一年了，一直纠结移动端是用zepto还是用jquery，移动端一直倾向于使用zepto，无奈zepto相关插件太少了，为了让jquery插件支持zepto不得不修改插件的源代码。今天我给大家展示的是如何让jquery.validate.js支持zepto库。

1、替换不兼容的选择器

a、将$.data(selector,dataname)改成$(selector).data(dataname);
b、将:submit,:reset,:image,:text 改成[type=‘submit‘],[type=‘image‘],type=‘text‘]

2、因为jquery和zepto获取不存在属性返回的值不一样，导致Number(value)返回的值也不一样，这个会导致mix..、max..验证不能去掉；

找到以下代码

if (/min|max/.test(method) && (type === null || /number|range|text/.test(type))) {
    value = Number(value);
}

替换成

if (/min|max/.test(method) && (type === null || /number|range|text/.test(type))) {
    value = (value === null || value === "") ? "undefined" : value;
    value = Number(value);
}

3、替换$.validator.format方法

// http://jqueryvalidation.org/jQuery.validator.format/
$.validator.format = function (source, params) {
    if (arguments.length === 1) {
        return function () {
            var args = [].slice.call(arguments[0])//$.makeArray(arguments);
            args.unshift(source);
            return $.validator.format.apply(this, args);
        };
    }
    if (arguments.length > 2 && params.constructor !== Array) {
        params = [].slice.call(arguments).slice(1);//$.makeArray(arguments).slice(1);
    }

    if (params.constructor !== Array) {
        params = [params];
    }
    console.log(params);
    $.each(params, function (i, n) {
        source = source.replace(new RegExp("\\{" + i + "\\}", "g"), function () {
            return n;
        });
    });
    return source;
};