javascript - 如何向自动完成下拉列表添加标签

Question

我正在为我的搜索模块使用 jquery autocomplete 下拉列表。

当某人第一次搜索时，它会显示该关键字的相关类别，然后显示项目。我想要的是在下拉列表中显示类别之前，在下拉框中添加一个名为“类别”的标签，并为项目“项目”添加一个标签

使用json加载数据

$query="SELECT b.title AS `value`, b.title AS `label`, b.id AS `cat_id`, b.metakey AS `desc`


$db->setQuery ( $query );

// Load the results as a list of associated arrays.
$results = $db->loadAssocList ();

echo json_encode ( $results );

请指教。

Answer 1

直接从 jQuery UI 自动完成文档复制:

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<label for="search">Search: </label>
<input id="search">

要将其合并到代码中，您可能需要通过 ajax 加载 JSON，向 PHP 脚本发送 GET 请求，然后使用返回的数据创建自动完成小部件(用响应数据替换源数据)。类似于以下内容:

$.get("http://yourURL.com",function(responseData){
    $( "#search" ).catcomplete({
        delay: 0,
        source: $.parseJSON(responseData)
    });
});