javascript - 使用自动完成功能时，.change() 在 Chrome 中不起作用

Question

.change() 事件在使用自动完成脚本时在 Chrome 中不起作用，而在输入自动完成中不存在的另一个值时起作用... 但我的代码在 Firefox 中完全运行正常

我的代码如下

    $('body').on('change', 'input[name^="itemNo"]', function(){

    var currentquantity = $(this).val();
    var maxquantity = $(this).data('maxquant');

    alert(currentquantity);
    alert(maxquantity);

    })

我的html代码如下

<input type="text" data-type="product_serial" name="itemNo[]" data-maxquant="" id="itemNo_1" class="form-control autocomplete_txt serial_number_append" autocomplete="off">

Answer 1

使用自动完成的更改事件。您可以使用“autocompletechange”事件绑定(bind)它:

$('input[name^="itemNo"]').on( "autocompletechange", function( event, ui ) {} ); 

或在初始化时，如以下示例所示:

$(function() {
  var availableTags = [
    "ActionScript",
    "AppleScript",
    "Asp"
  ];
  $('input[name^="itemNo"]').autocomplete({
    source: availableTags
  }, {
    change: function(event, ui) {
      var currentquantity = $(this).val();
      var maxquantity = $(this).data('maxquant');

      alert(currentquantity);
      alert(maxquantity);
      return false;
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src=https://code.jquery.com/ui/1.11.2/jquery-ui.js "></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<input type="text " data-type="product_serial " name="itemNo[] " data-maxquant=" " id="itemNo_1 " class="form-control autocomplete_txt serial_number_append " autocomplete="off ">

有关更多信息，请参阅文档:autocomplete API