douhanshu5517
douhanshu5517
2016-09-09 13:31

使用过的条码扫描功能键两次

i have assigned each student a barcode in their IDs. and im using barcode scanner to scan their IDs to check their attendance. im using a keyup function but everytime i scanned the barcode in their ID the keyup function executed twice.

 <script type="text/javascript">


       function loaddelegates($barcode)
         {
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function() {
              if (this.readyState == 4 && this.status == 200) {
               document.getElementById("getdel").innerHTML = this.responseText;
               $("#barcode").focus();
              }
            };
            xhttp.open("GET", "mealclient/" + $barcode, true);
            xhttp.send();

          }

$(function() {
           $('#barcode').attr('maxlength','13');
        $(document).on('keyup','#barcode',function(e) {
           e.preventDefault();
            if ($(this).val().length >= 13) {
                loaddelegates($(this).val());
                return false;
            }
        });
      });

  <div class="site-wrapper-inner">

    <div class="cover-container">

      <div class="masthead clearfix">
        <div class="inner">
          <h3 class="masthead-brand">PITYLC</h3>
          <nav>
            <ul class="nav masthead-nav">
            @foreach($meals as $meal)
              <li class="active"><a href="#">{{$meal->date}}</a></li>
            @endforeach
            </ul>
          </nav>
        </div>
      </div>
      <img src="/img/COVER.png" class="img-responsive" alt="Responsive image">

      <div class="inner cover" id = "getdel">
      @foreach($meals as $meal)
        <h1 class="cover-heading" style = "font-weight: Bold">{{strtoupper($meal->meal)}}</h1>
      @endforeach
         <div class="form-group">
            <label style = "color: #e36c1d">BARCODE</label>
            <input class="form-control" style="font-size:30px; color: #e36c1d"  id = "barcode" autofocus>
        </div>
         <div class="form-group">
            <label style = "color: #e36c1d">NAME</label>
            <input class="form-control" style="font-size:30px; color: #e36c1d" >
        </div>
         <div class="form-group" >
            <label style = "color: #e36c1d">ORGANIZATION</label>
            <input class="form-control" style="font-size:30px; color: #e36c1d" >
        </div>
         <div class="form-group">
            <label style = "color: #e36c1d">POSITION</label>
            <input class="form-control" style="font-size:30px; color: #e36c1d">
        </div>
         <div class="form-group">
            <label style = "color: #e36c1d">SCHOOL</label>
            <input class="form-control" style="font-size:30px; color: #e36c1d">
        </div>


      </div>



    </div>

  </div>

</div>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

1条回答

  • douzhang5121 douzhang5121 5年前

    I could imagine that the barcode reader is somehow simulating a key press, as you listen for keyup. Probably it simulates two keys - e.g. Ctrl + V would call your function twice.

    To debug this issue I would recommend to add

    var code = e.keyCode || e.which;
    console.log(code);
    

    at the very top of your keyup listener. Check the console output. So if the reader really simulates two keys at once you could certainly ignore one of both.

    EDIT: As the OP wrote, 13 is shown up in the console additionally to another key code. 13 is the ASCII code for CR (carriage return).

    So to ignore this key write:

    $(document).on('keyup','#barcode',function(e) {
          e.preventDefault();
          var code = e.keyCode || e.which;
          if (code != 13 && $(this).val().length >= 13) {
              loaddelegates($(this).val());
          }
    });
    
    点赞 评论 复制链接分享