Question

我正在使用jQuery-ui autocomplete。以下是我如何使用它

<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

因为选择事件的默认行为是显示值而非标签，所以您需要简单地：
- 返回错误 为前面提到的“ İsmailHakkıŞ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);
    }
});

请参阅此帖中的“ Andrew Whitaker ”回答＆gt; Autocomplete applying value not label to textbox - 因为它对理解非常有帮助。

Answer 2

你必须告诉你的代码注重做某事。

$('#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;
    }
});

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

2 个答案: