Question

我正在尝试编写一个JavaScript函数，该函数将涵盖input的所有type="time"元素的验证。我正在查看jQuery Validate的文档，但我只找到验证绑定在id或name属性的示例。有没有办法在全球范围内做到这一点？

我想确保时间始终为hh:mm格式。我找到了一个能够验证我的时间的功能（见下文）。当此函数返回false时，我将调用addError()函数向表单添加错误。我不知道该怎么做。

// Check is the input is a valid time
function formatTime(time) {
    var result = false, m;
    var re = /^\s*([01]?\d|2[0-3]):([0-5]\d)\s*$/;
    if ((m = time.match(re))) {
        result = (m[1].length == 2 ? "" : "0") + m[1] + ":" + m[2];
    }
    return result;
}

// Trigger the validation on the onBlur event
$("input[type=time]").blur(function () {
    var value = formatTime($(this).val());
    if (value == false) {
        addError($(this));
    }
});

Edit1：看起来我的复制/粘贴技巧不是那么好。在formatTime()中，如果格式有效，则返回时间，否则返回false。

Answer 1

引用OP：

“我正在查看jQuery Validate的文档，但我只是查找验证绑定在id或name的示例属性。有没有办法在全球范围内做到这一点？“

是的。也可以使用the .rules('add') method来应用规则，并且此方法可以附加到任何合法的jQuery选择器。要在多个元素上使用此方法，必须将其包含在the jQuery .each() method内。（另请注意，即使您未使用name属性，每个input也必须包含唯一的name。）

$(document).ready(function() {

    $('#myform').validate({  // initialize the plugin on your form
        // any rules and/or options
    });

    $('input[type="time"]').each(function() {
        $(this).rules('add', {
            required: true,
            // another rule, etc.
        });
    });

});

工作演示：http://jsfiddle.net/g8YFa/

See this answer for complete info about adding rules using this plugin.

Answer 2

您希望declare a custom validation method验证时间格式。

$.validator.addMethod('correctTimeFormat', function (value, element) {
    var result = false, m, regex = /^\s*([01]?\d|2[0-3]):([0-5]\d)\s*$/;

    if (m = value.match(regex)) {
        result = (m[1].length === 2 ? '' : '0') + m[1] + ':' + m[2];
    }

    return result;
}, 'Invalid time format.');

然后，要求所有input time字段的自定义验证方法。

$('input[type="time"]').validate({
    rules: {
        value: { correctTimeFormat: true }
    }
});

Answer 3

// Check is the input is a valid time
function formatTime(time) {
    var result = false, m;
    var re = /^\s*([01]?\d|2[0-3]):([0-5]\d)\s*$/;
    if ((m = time.match(re))) {
        //Well it seems like its valid lets return true!  
        return true;
    }else{
       //Well it seems like this is invalid return false!  
        return false;
    } 
}

Answer 4

您必须从formatTime（）函数返回值true / false。所以它将设置在你的“var value = formatTime（$（this）.val（））;”声明！

jQuery验证给定类型的所有输入

4 个答案: