我正在尝试使用jQuery Mask Plugin by Igor Escobar进行时间验证:
$("input").mask("Hh:Mm",{
translation: {
'H': { pattern: /[0-2]/ },
'h': { pattern: /[0-9]/ },
'M': { pattern: /[0-5]/ },
'm': { pattern: /[0-9]/ }
}
});
在此解决方案中,可以输入无效时间,如26:53
。我也无法使用am
或pm
,只能使用24小时格式。该模式似乎只适用于一个符号。如何将它用于更多角色?像这样([01]?[0-9]|2[0-3])
我还尝试在输入后验证值:
$("input").each(function() {
el = $(this);
el.mask("Hh:Mm", {
onComplete: function(cep) {
if (!/^([01]?[0-9]|2[0-3]):[0-5][0-9]$/.test(cep)) {
alert('Error');
el.attr("value","");
}
},
translation: {
'H': { pattern: /[0-2]/ },
'h': { pattern: /[0-9]/ },
'M': { pattern: /[0-5]/ },
'm': { pattern: /[0-9]/ }
}
});
});
此解决方案不太好,因为我仍然允许用户输入错误的内容。我该如何解决这个问题?
答案 0 :(得分:7)
我使用函数掩码
找到了解决此问题的方法 var maskBehavior = function (val) {
val = val.split(":");
return (parseInt(val[0]) > 19)? "HZ:M0" : "H0:M0";
}
spOptions = {
onKeyPress: function(val, e, field, options) {
field.mask(maskBehavior.apply({}, arguments), options);
},
translation: {
'H': { pattern: /[0-2]/, optional: false },
'Z': { pattern: /[0-3]/, optional: false },
'M': { pattern: /[0-5]/, optional: false}
}
};
$('.daytimemask').mask(maskBehavior, spOptions);
这似乎工作正常,但有必要在“12”之前的几个小时添加左零。
我希望这会有所帮助。
答案 1 :(得分:0)
var maskBehavior = function (val) {
val = val.split(":");
return (parseInt(val[0]) > 19) ? "HZ:M0" : "H0:M0";
},spOptions = {
onKeyPress: function (val, e, field, options) {
if (val.length == 1 && parseInt(val) > 2) {
val = pad$(val, 2);
arguments[0] = val;
field.val(val);
} else if (val.length > 3) {
val = val.split(":");
if (parseInt(val[1]) > 5) {
val = val[0] + ':' + pad$(val[1], 2);
arguments[0] = val;
field.val(val);
};
};
field.mask(maskBehavior.apply({}, arguments), options);
},
translation: {
'H': { pattern: /[0-9]/, optional: false },
'Z': { pattern: /[0-3]/, optional: false },
'M': { pattern: /[0-9]/, optional: false }
}
};