jquery ui 自动完成事件计时

Question

我需要返回一个选择的数字 ID，但以文字显示客户名称。我有一个用于客户 ID 的隐藏字段和一个用于显示名称的文本输入。它有点有效，但我更愿意改善用户体验。

ajax 请求返回变量数据中的客户列表，该变量数据用于构建对象数组，根据文档：

values = [];
$.each(data, function(index, guest) {
    values.push({label: guest, value: index});
});

然后我将自动完成绑定到表单字段：

$( "#customer" + numRand ).autocomplete({
    source: values,
    minLength: 2,
    select: function (event, ui) {      // set hidden field with index of selection
        $( "#customerId" + numRand ).val(ui.item['value']);
    },
    change: function (event, ui) {      // restore word label to input field
        $( "#customer" + numRand ).val(ui.item['label']);
    }
});

numRand 用于创建半唯一标识符，因为在此应用程序中表单在 JQuery ui 对话框中加载，否则实例之间的值会保留。

我尝试使用 change 事件而不是 close，但结果是相同的。* 当至少输入两个字母时表单字段菜单正确显示并显示名称。选择名称后，数字索引将进入表单字段。当焦点移动到页面的任何其他部分时（单击背景即可），数字索引将根据需要替换为客户名称。我也希望最初显示的名称。

关于如何让名称显示在选择上有什么建议吗？ （我尝试将它放入该处理程序中，但它会立即被焦点移动时保留在那里的 id 覆盖）。

预先感谢您的任何建议。

*编辑 - 我错了，close事件，就像select事件一样，被内置方法覆盖。

更新：解决方案很简单：使用 select 事件并通过返回 false 覆盖内置方法：

$( "#customer" + numRand ).autocomplete({
    source: values,
     minLength: 2,
     select: function (event, ui) {      
        $( "#customerId" + numRand ).val(ui.item['value']);
        $( "#customer" + numRand ).val(ui.item['label']);
        return false;
    }
});

Answer 1

解决方案很简单：使用 select 事件并通过返回 false 来覆盖内置方法：

$( "#customer" + numRand ).autocomplete({
   source: values,
   minLength: 2,
   select: function (event, ui) {      
      $( "#customerId" + numRand ).val(ui.item.value);
      $( "#customer" + numRand ).val(ui.item.label);
      return false;
  }
});