Question

功能性：

用户将使用扫描仪扫描其ID，其ID值将显示在文本字段中。扫描ID时有几种检查条件，它们是：

1。）检查ID值的第一个字符，如果字符等于第一个字符，则执行第二个条件检查，否则将显示错误页面

2。）检查ID值的长度，如果ID值的长度等于规定的长度，它将导航到下一页，否则将显示错误页面。

问题：

我能够满足第一个条件检查，它能够检查ID输入的第一个字符。

然而，我遇到了这个问题，它总是会失败第二个条件（无论是通过第一个条件还是第一个条件失败）。我遇到的行为是：

- ＆GT;当我输入通过第一个条件的第一个字符（检查第一个字符与所述第一个字符检查符合）或者即使第一个字符与第一个条件不匹配时，它总是会失败第二个条件（不相等）到规定的ID长度）。因此，在完成长度检查之前，它不会等待扫描ID的完整和最终长度。

因此，我需要问一下，只有在扫描完整个ID值后才能检查第二个条件，而不是在完全扫描ID值之前检查第二个条件。

代码：

＆＃13;

/*================= SCAN:Citizen OR PR ID BARCODE===================================================================================================*/
$("#NRICCodeField").on("input", function(e) {


  /*===Slice and Grab the First Character of the ID captured===*/
  var ID_First_Character = $("#NRICCodeField").val().slice(0, 1);

  console.log("ID_First_Character:" + ID_First_Character);

  console.log("NRICCodeField:" + NRICCodeField);

  /*==============Check for  First character if it is Citizen ==> S/T or FIN ==> F/G: if is citizen ID: accept and check for duplicate: else if it is FIN ID: splice and accept first 9 characters and check for duplicates============================*/

  if ((ID_First_Character == 'S') || (ID_First_Character == 'T')) {

    /*========Check for 9 characters in ID card, if it is 9 characters: accept and perform other checks, else reject=======================================*/
    if ($("#NRICCodeField").val().length == 9) {
      console.log("Local NRICCodeField equal to 9 characters");
      alert("Your Citizen ID is valid");

    } else if ($("#NRICCodeField").val().length != 9) {
      console.log("Local NRICCodeField is not equal to 9 characters");

      $('#Scan_Page').fadeOut();
      $('#Invalid_ID').fadeIn();

      setTimeout(function() {

        $('#Invalid_ID').fadeOut();
        $('#Scan_Page').fadeIn();

        //Reset Field to empty
        $("#NRICCodeField").val("");
        $("#NRICCodeField").focus();
      }, 6000);
    }
  } else if ((ID_First_Character == 'G') || (ID_First_Character == 'F')) {

    //If Detect Scanned ID is FIN, Slice first 9 characters and accept and check for Duplicate
    var WorkerPermitID = $("#NRICCodeField").val().slice(0, 9);

    if (WorkerPermitID.length == 9) {

      alert("Your FIN ID is valid");
    }
  } else {

    $('#Scan_Page').fadeOut();
    $('#Invalid_ID').fadeIn();

    setTimeout(function() {

      $('#Invalid_ID').fadeOut();
      $('#Scan_Page').fadeIn();

      //Reset Field to empty
      $("#NRICCodeField").val("");
      $("#NRICCodeField").focus();
    }, 6000);
  }
});

＆＃13;

<div id="Scan_Page" align=" center" style="position:absolute; width:1920px; height:1080px; background-repeat: no-repeat; z-index=1; top:0px; left:0px;">

  <input type="password" id="NRICCodeField" style="position:absolute; top:545px; left:690px; height:68px; width:545px; outline: 0; border: 0; font-size:70px; font-color:#765725; font-family:'Gothic'; background: transparent; z-index:100;" autofocus src="lib/image/transparent.png">
</div>

<div id="Invalid_ID" align=" center" style="position:absolute; width:1920px; height:1080px; background-repeat: no-repeat; z-index=2; top:0px; left:1921px;">
  <img id="Invalid_ID_msg" src="lib/image/InvalidScan.png" style="position:absolute; top:0px; left:0px; margin:auto;" />
</div>

＆＃13;

JSFIddle中的代码：https://jsfiddle.net/agtf35ks/2/

Plunker中的代码：https://plnkr.co/edit/HWgTjWDDLePFovLZSyS4?p=catalogue

Answer 1

这样的事情怎么样？在有9个字符之前，它不会处理输入。基本上，我关闭验证并阻止任何事情发生，直到有9个字符。

    $("#NRICCodeField").on("input", function(e) {
        if(this.value.length == 9){
            validateInput();
            return;
        }
        e.stopPropagation();
        return false;

    });

    function validateInput() {}
           /*===Slice and Grab the First Character of the ID captured===*/
        var ID_First_Character = $("#NRICCodeField").val().slice(0, 1);


    /// and so on for the reast of your validation

<input /> Textfield.val（）无法检查条件

1 个答案: