jQuery 自动完成显示值而不是标签

Question

我正在使用jQuery-ui 自动完成。这是我如何使用它

<form action="go.php" method="post">
    <input id="txt" type="text" />
</form>

<script>
    $('#txt').autocomplete({
         source: [{'label': 'milan', 'value': '1'}, {'label': 'minos', 'value': '2'}]
    })
</script>

当我输入“mi”milan并minos出现时，没问题。但是，当我关注它们时，向下键值#txt更改为1（米兰的值）而不是milan. milan当我专注于它时，我该如何展示。谢谢

Answer 1

你必须告诉你的代码焦点去做某事。

$('#txt').autocomplete({
     source: [{'label': 'milan', 'value': '1'}, {'label': 'minos', 'value': '2'}],
    focus: function( event, ui ) {
      $(this).val(ui.item.label);
      return false;
    },
    select: function( event, ui ) {
     $(this).val(ui.item.label);
      return false;
    }
});

Answer 2

因为select事件的默认行为是显示值而不是标签，所以您需要简单地：
-将 false 返回为前面提到的“ ?smail Hakk??en ”。
- 或者你可以使用event.preventDefault()来阻止事件的默认动作执行，然后写下你需要做的事情如下：

$('#txt').autocomplete({
     source: [{'label': 'milan', 'value': '1'}, {'label': 'minos', 'value': '2'}],
    focus: function( event, ui ) {
      event.preventDefault();
      $('#txt').val(ui.item.label);
    },
    select: function( event, ui ) {
     event.preventDefault();
     $('#txt').val(ui.item.label);
    }
});

请参考这篇文章中的“安德鲁惠特克”答案>自动完成将值而不是标签应用到文本框- 因为它对理解非常有帮助。