自动完成箭头键不起作用

Question

我使用自动完成从数据库中检索数据

$('input[name=\'product_name\']').autocomplete({

  'source': function(request, response) {

    $.ajax({
      url: 'index.php?route=checkout/cart/autocomplete&name=' +  encodeURIComponent(request), //Controller route
      dataType: 'json',
      success: function(json) {
        response($.map(json, function(item) {
          return {
            label: item['name'],
            value: item['product_id']
          }
        }));
      }
    });
  },

  'select': function(item) {

    $('input[name=\'product_id\']').val(item['value']);
    $('input[name=\'product_name\']').val(item['label']);
  },

    focus: function(event, ui) {
          return false;
    }
});

我已经把焦点返回 false 但我的下拉箭头键仍然不起作用。 我也尝试使用 event.preventDefault();

Answer 1

您的jquery-ui-autocomplete select事件处理程序存在一些问题。 所以试试这个脚本 -

$('input[name=\'product_name\']').autocomplete({
  source: function(request, response) {
    $.ajax({
      url: 'index.php?route=checkout/cart/autocomplete&name=' +  encodeURIComponent(request), //Controller route
      dataType: 'json',
      success: function(json) {
        response($.map(json, function(item) {
          return {
            label: item['name'],
            value: item['product_id']
          }
        }));
      }
    });
  },
  select: function(event , ui) {
    $('input[name=\'product_id\']').val(ui.item.value);
    $('input[name=\'product_name\']').val(ui.item.lable);
  },
  focus: function(event, ui) {
    return false;
  }
});

jquery-ui-autocomplete事件选择回调指定：

$( ".selector" ).autocomplete({ select: function( event, ui ) {} });

并希望这将解决您的问题。