我正在尝试复制 CC exp日期 MM / YY格式字段的行为,如Digital Ocean所示[您需要登录到请参阅页面和付款表格]
它的工作原理如下:
1.如果我按 0 或 1 ,它会等待进一步输入
2.如果我按 2 - 9 之间的任何内容,它会转换为02/
,09/
等,然后等待 YY
用户可以按01/
,我必须处理
用户可以按1/
,我也必须处理
对DO的检查不是很严格,允许输入15/34
或复制粘贴非法值,这些值是单独处理的。
我尝试添加一个oninput
事件监听器来检查输入值,并修改该值是否大于2的数字。但这似乎并不优雅。我必须在每次按键后检查输入字段值,它看起来像一团糟。
修改
在仔细思考之后,我终于能够重新创建大部分预期的功能,但它仍然不完美。
jQuery('body').on('keyup', '.paymentDate', function(e){
console.log($(this).val());
var val = $(this).val();
if(!isNaN(val)) {
if(val > 1 && val < 10 && val.length == 1) {
temp_val = "0" + val + "/";
$(this).val(temp_val);
}
else if (val >= 1 && val < 10 && val.length == 2 && e.keyCode != 8) {
temp_val = val + "/";
$(this).val(temp_val);
}
else if(val > 9 && val.length == 2 && e.keyCode != 8) {
temp_val = val + "/";
$(this).val(temp_val);
}
}
else {
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="paymentDate" class="paymentDate">
是否有更智能的方式或插件可以有效地处理这个问题?
答案 0 :(得分:0)
在第三个if语句中再添加一个条件
else if(val > 9 && val.length == 2 && e.keyCode != 8) {
if (val > 12) {
temp_val = "0" + val[0] + "/" + val[1];
$(this).val(temp_val);
} else {
temp_val = val + "/";
$(this).val(temp_val);
}
}