使用标签自动完成，而不是值

Question

我想添加一个 jquery-ui 的自动完成字段。我有一个包含值和标签的对象列表，我希望当用户选择一个项目时，值进入隐藏字段并且标签位于自动完成字段中。但是文档说 "The value will be inserted into the input element when a user selects an item".

可以改变这种行为吗？我认为如果显示标签而不是值本身，它会更加用户友好。

Answer 1

关注select字段：使用ui作为参数，你可以使用ui.item.label和ui.item.value来施展魔法。 使用 preventDefault() 阻止预定义的 jQuery 行为。

$('#your_element').autocomplete({
  // [...]    
  select: function(e,ui){
    e.preventDefault();
    // set value in your element
    $(this).val(ui.item.label);
    // set value in the hidden field
    $('#hidden').val(ui.item.value);
  },
  // [...]    
});