输入少于4位数时阻止输入密钥

时间:2014-04-25 11:15:06

标签: javascript

我正在尝试在我的脚本中实现一个代码,该代码将阻止输入密钥,直到在文本字段中输入4位数字。

以下是我的表格:

<div id="inputtext">
      <input type="text" id="dreamtext" maxlength="45" spellcheck='false' autofocus/>
      <input type="submit" id="nextstepbutton" value="next step" onclick="window.open('step3.html','_self','resizable=yes')" />
    </div>

此特定脚本在&lt;时保留提交按钮。输入4个字符,并在输入4个或更多字符时显示。它还修改了一些div内容。

<script type="text/javascript">
$(function(){
     $("#nextstepbutton").hide();

     $("#dreamtext").keyup(function() {
         var val = $(this).val();
         if (val.length > 3) {
             $('#nextstepbutton').show();
             document.getElementById("message").innerHTML = "<h1>hit return or next step</h1>";
         }
         else {
             $('#nextstepbutton').hide();
             document.getElementById("message").innerHTML = "<h1>type please</h1>";
         }

     });
});
</script>

此脚本在按下键时按下提交按钮

<script type="text/javascript">
$("#dreamtext").keyup(function(event){
    if(event.keyCode == 13){
        $("#nextstepbutton").click();
    }
});
</script>

现在,输入少于4位数时阻止输入密钥的最佳方法是什么?感谢

1 个答案:

答案 0 :(得分:2)

keydown(/ up / press)事件中有一个名为preventDefault的方法。 这使得任何默认操作都不会发生。

$("#dreamtext").keyup(function(event) {
    if ($(this).val().length < 4) {
        event.preventDefault();
    }
    if (event.keyCode == 13) {
        $("#nextstepbutton").click();
    }
});

您还可以将其连接到jQuery .submit()处理程序。

    $("#someForm").submit(function(){
      if ($("#dreamText").val().length < 4)  {
        return false;
      }
    })