Javascript 如何限制一个字段只接受4个数字字符作为输入并获取'；div中有警报_Javascript_Jquery_Html

Javascript 如何限制一个字段只接受4个数字字符作为输入并获取'；div中有警报

javascript jquery html

Javascript 如何限制一个字段只接受4个数字字符作为输入并获取'；div中有警报,javascript,jquery,html,Javascript,Jquery,Html,我想要一个文本字段只接受数字作为一些控制键，数字应该正好是四位数长。我的代码如下： <div id="main" role="main"> Input a 4-digit: <input type="text" class="validateYearTextBox" /> </div> <div id="alert"></div> function checkValidInput

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

<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位数字：
函数checkValidInput（）{
$（“.validateyartextbox”）.keydown（函数（事件）{
如果（！（（event.keyCode==46 | |
event.keyCode==8 | |
event.keyCode==37 | |
event.keyCode==39 | |
event.keyCode==9）|
$（this）.val（）.length<4&&
（（event.keyCode>=48&&event.keyCode=96&&event.keyCode尝试以下方法：
Jsfiddle：
只需添加：
$(".validateYearTextBox").keyup(function(event) {    
  if( $(this).val().length == 4){
     $("#alert").text("valid")
   } else {
     $("#alert").text("")
   }
});

试试这个：
Jsfiddle：
只需添加：
$(".validateYearTextBox").keyup(function(event) {    
  if( $(this).val().length == 4){
     $("#alert").text("valid")
   } else {
     $("#alert").text("")
   }
});


请尝试以下操作：
<div id="main" role="main">
    Input a 4-digit: <input type="text" class="validateYearTextBox" />
</div>
<div id="alert"></div>

<script>
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;                       
            }

            // count number of characters entered
            var cs = $('.validateYearTextBox').val().length;
            if(cs == 3)
            {
                $('#alert').html('valid'); 
            }
            else
            {
                $('#alert').html(''); 
            }
    });
}
$(document).ready(function() {

    checkValidInput();
});
</script>


输入一个4位数字：
函数checkValidInput（）{
$（“.validateyartextbox”）.keydown（函数（事件）{
如果（！（（event.keyCode==46 | |
event.keyCode==8 | |
event.keyCode==37 | |
event.keyCode==39 | |
event.keyCode==9）|
$（this）.val（）.length<4&&
（（event.keyCode>=48&&event.keyCode=96&&event.keyCode
请尝试以下操作：
<div id="main" role="main">
    Input a 4-digit: <input type="text" class="validateYearTextBox" />
</div>
<div id="alert"></div>

<script>
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;                       
            }

            // count number of characters entered
            var cs = $('.validateYearTextBox').val().length;
            if(cs == 3)
            {
                $('#alert').html('valid'); 
            }
            else
            {
                $('#alert').html(''); 
            }
    });
}
$(document).ready(function() {

    checkValidInput();
});
</script>


输入一个4位数字：
函数checkValidInput（）{
$（“.validateyartextbox”）.keydown（函数（事件）{
如果（！（（event.keyCode==46 | |
event.keyCode==8 | |
event.keyCode==37 | |
event.keyCode==39 | |
event.keyCode==9）|
$（this）.val（）.length<4&&
（（event.keyCode>=48&&event.keyCode=96&&event.keyCode您可以对其使用正则表达式并更改为keyup
事件：

函数checkValidInput（）{
var re=/\d{4}/g，
dt=$（'.validateYearTextBox'），
味精；
msg=re.test（dt.val（））？“有效”：“无效”；
$（'警报'）.text（msg）；
}
$（“.validateyartextbox”）.keyup（checkValidInput）；

输入一个4位数字：
您可以对其使用正则表达式并更改为keyup
事件：

函数checkValidInput（）{
var re=/\d{4}/g，
dt=$（'.validateYearTextBox'），
味精；
msg=re.test（dt.val（））？“有效”：“无效”；
$（'警报'）.text（msg）；
}
$（“.validateyartextbox”）.keyup（checkValidInput）；

输入一个4位数字：
我会这样做
function checkValidInput() {
    $(".validateYearTextBox").keydown(function(event) {    

       if( $(this).val().length == 3){
            $('#alert').html('<p>SUCCESS</p>');
       } 
        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();
});

函数checkValidInput（）{
$（“.validateyartextbox”）.keydown（函数（事件）{
if（$（this.val（）.length==3）{
$（“#警报”）.html（“SUCCESS”）；
} 
如果（！（（event.keyCode==46 | |
event.keyCode==8 | |
event.keyCode==37 | |
event.keyCode==39 | |
event.keyCode==9）|
$（this）.val（）.length<4&&
（（event.keyCode>=48&&event.keyCode=96&&event.keyCode我会这样做
function checkValidInput() {
    $(".validateYearTextBox").keydown(function(event) {    

       if( $(this).val().length == 3){
            $('#alert').html('<p>SUCCESS</p>');
       } 
        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();
});

函数checkValidInput（）{
$（“.validateyartextbox”）.keydown（函数（事件）{
if（$（this.val（）.length==3）{
$（“#警报”）.html（“SUCCESS”）；
} 
如果（！（（event.keyCode==46 | |
event.keyCode==8 | |
event.keyCode==37 | |
event.keyCode==39 | |
event.keyCode==9）|
$（this）.val（）.length<4&&
（（event.keyCode>=48&&event.keyCode=96&&event.keyCode在将onblur=“checkValidInput”id=“validateyartextbox”添加到输入标记后尝试此简单脚本。）
function checkValidInput(){
var x,text;
x=document.getelementbyid("validateYearTextBox").value;
if(x==4)
text="Valid";
else
text="Not valid";
}
document.getelementbyid("alert").innerHTML=text;

将onblur=“checkValidInput”id=“validateYearTextBox”添加到输入标记后，请尝试此简单脚本
function checkValidInput(){
var x,text;
x=document.getelementbyid("validateYearTextBox").value;
if(x==4)
text="Valid";
else
text="Not valid";
}
document.getelementbyid("alert").innerHTML=text;

JQuery val（）.length（）计数从0开始是否确定？即使数组的长度也不是从0开始。@Jai对该语句感到抱歉..！JQuery val（）.length（）计数从0开始是否确定？即使数组的长度也不是从0开始。@Jai对这句话表示抱歉..！添加一些关于此答案如何帮助解决当前问题的解释和关于此答案如何帮助解决当前问题的解释和关于此答案如何帮助解决当前问题的解释