javascript - 如何限制字段仅接受 4 个数字字符作为输入并在 div 中获取警报

标签 javascript jquery html

我想要一个文本字段只接受数字作为一些控制键,并且数字应该正好是四位数字长。我的代码如下:

<div id="main" role="main">
                Input a 4-digit: <input type="text" class="validateYearTextBox" />
            </div>
<div id="alert"></div>

function checkValidInput() {
    $(".validateYearTextBox").keydown(function(event) {       
        if (!((event.keyCode == 46 || 
            event.keyCode == 8  || 
            event.keyCode == 37 || 
            event.keyCode == 39 || 
            event.keyCode == 9) || 
            $(this).val().length < 4 &&
            ((event.keyCode >= 48 && event.keyCode <= 57) ||
            (event.keyCode >= 96 && event.keyCode <= 105)))) {
                        // Stop the event
                        event.preventDefault();
                        return false;                       
            }
    });
}
$(document).ready(function() {

    checkValidInput();
});

当我在文本框中输入 4 位数字时,div 中应显示一个警报“有效”

这是Fiddle

最佳答案

试试这个:

Jsfiddle:https://jsfiddle.net/jz1ra36d/

只需添加:

$(".validateYearTextBox").keyup(function(event) {    
  if( $(this).val().length == 4){
     $("#alert").text("valid")
   } else {
     $("#alert").text("")
   }
});

关于javascript - 如何限制字段仅接受 4 个数字字符作为输入并在 div 中获取警报,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37202977/

相关文章:

html - 如果我添加 css : top,包装器会向右移动

javascript - HTML 文件在 Electron 中的加载方式与在浏览器窗口中的加载方式不同

javascript - 如何在Chrome扩展中同步执行外部js文件

Javascript:将链接文本更改为新文本填充或收缩文本以保持其与原始文本的大小相同

javascript - 将平面对象数组转换为嵌套树(位置数据)

javascript - 大规模 jQuery 选择器缓存

html - 高度等于视口(viewport)的方形 DIV

javascript - 如何区分 '<li>'(无类/id)和 '<li class="hasClass">'?

javascript - 为什么 Privacy Badger 会阻止 Firebase javascript 文件?

javascript - 如果 TD 不包含值,多个复选框会隐藏行