Question

在使用对象数组作为源的JQuery自动完成中，我可以在INPUT中显示标签，然后访问该值吗？默认行为是选择后该值显示在INPUT中。在这种情况下，值表示表中行中唯一键的索引。

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>autocomplete demo</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
</head>
<body>
    <label for="autocomplete">Select a programming language: </label>
    <input id="autocomplete">
    <script>
    $( "#autocomplete" ).autocomplete({
      source: [ { label:"c++", value:1 }, { label: "java", value:2 }, { label: "javascript", value:3 } ]
    });
    </script>
</body>
</html>

Answer 1

按所选标签设置输入值以显示标签而不是其值

$( "#autocomplete" ).val( ui.item.label );

在输入

上添加数据属性

<input id="autocomplete" data-value>

并存储选定的值

$( "#autocomplete" ).attr("data-value",ui.item.value);

这是JSFiddle

使用对象数组作为源来返回JQuery自动完成的值

1 个答案: