javascript - X 个字符后自动提交表单

Question

我有一个表单，其中只有一个输入，由条形码扫描仪填写。仅当输入内容为 7 个字符时，我才尝试使用 JS 或 Jquery 提交表单。我希望它的表单自动提交，而无需用户单击提交。我看过很多例子，但还没有找到可行的解决方案。

这是我的尝试:

<form action="PupListMobile.php" id="my_form" method="get">
     <label for="text-1"></label>
     <input type="text" autofocus name="sID" id="sID" value="" id="my_button" placeholder="CLICK TO SCAN:">
     <input type="hidden" name="lane" value="1" />
     <input id="subHere"type="submit" value="Submit"  />

</form>

J查询:

$('#sID').keyup(function(){
    if(this.value.length ==7){
    $('#subHere').click();
    }
});

$(document).ready(function() {
  $(window).keydown(function(event){
    if(event.keyCode == 13) {
      event.preventDefault();
      return false;
    }
  });
}); 

Answer 1

我将从以下内容开始:

1. 将 maxlength="7" 添加到文本输入中，因为您正在使用 keyup(..)，这样您就无法按住某个键来强制输入文本输入超过7个字符
2. 使用jquery函数检测长度然后提交输入的形式

设置最大长度

<input type="text" autofocus name="sID" id="sID" value=""
    id="my_button" placeholder="CLICK TO SCAN:" maxlength="7" />

自动提交表单

    $(function() {
      var $id = $('#sID');
      $id.keyup(function(e) {
        if ($id.val().length >= 7) {
          $(this.form).submit();
        }
      });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<form action="PupListMobile.php" id="my_form" method="get">
     <label for="text-1"></label>
     <input type="text" autofocus name="sID" id="sID" value="" id="my_button" placeholder="CLICK TO SCAN:" maxlength="7" />
     <input type="hidden" name="lane" value="1" />
     <input id="subHere"type="submit" value="Submit"  />

</form>