我有一个text box用于在（订单号）data中搜索的database。返回的（产品）随后作为data添加到 中。当用户更改中的时，将从 中删除。selectoptiondataselectdatatext box

它的功能在某种程度上可以按我想要的方式工作，但是我有options重复项并且没有全部options删除。

我不确定代码中哪里出了问题，希望得到一些指导。

$(document).ready(function() {
    $('#order_number').on('keyup', function(e) {
        var myCustomer = document.getElementById('customer');
        myCustomer.value = "";

        var mySelect = document.getElementById('product');
        var products_from_query = '';    

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

        // do nothing if it's an arrow key                    
        if (code == 37 || code == 38 || code == 39 || code == 40) {
            return;
        }

        var keyword = $('#order_number').val();

        if (keyword.length) {
            $.ajax( {
                 url: '../stocks/order_search',
                 type: 'GET',
                 dataType: 'json',
                 data: "keyword=" + keyword,
                 success: function(data) {
                     var length = mySelect.options.length;

                     for (i = 0; i < length; i++) {
                          mySelect.options[i] = null;
                     }

                     for (var i = 0; i < data.length; i++) {
                          newOption = document.createElement('option');

                          newOption.value = data[i]['ProductName'];

                          var options_seperator = ' - ';
                          var options_product_name = data[i]['ProductName'];
                          var options_product_description = data[i]['ProductDescription'];

                          var options_data = options_product_name.concat(options_seperator).concat(options_product_description);

                          if (typeof newOption.textContent === 'undefined') {

                              newOption.innerText = options_data;
                          } else {
                               newOption.textContent = options_data;
                          }

                          mySelect.appendChild(newOption);
                       };

                       myCustomer.value = data[0]['Customer'];
                 }                     

              })
          }                     

     });
 });

解决方案

您需要在 ajax 调用之前添加以下一行。

mySelect.html('');