Question

我正在使用jQuery UI创建自动填充搜索栏

我正在尝试修改以下内容，以根据页面上元素的ID名称填充可用标记列表，

var availableTags = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "BASIC",
        ];

例如，在页面上，我将有一个元素，如

<div class="items" id="Get milk">Don't forget to get milk on way home from work</div>

一旦使用这些元素ID填充列表，并且特定ID已自动完成，我将所有其他元素设置为display: none;

Answer 1

您需要使用$("...").map将类似源数组的对象（在本例中是一个填充了与.items选择器匹配的DOM节点的jQuery对象）转换为jQueryUI自动完成可以使用的数组。这样的事情应该有效：

var source = $(".items").map(function () {
    return $(this).data("id");
}).get();

$("#auto").autocomplete({
    source: source        
});

假设您使用data-id属性，那么您的标记将如下所示：

<div class="items" data-id="Get Milk">Get Milk on the way home</div>
<div class="items" data-id="Drop by Phil's">Drop by Phils house</div>
<div class="items" data-id="Grab a Sandwich">Grab a sandwich</div>

示例： http://jsfiddle.net/J5rVP/25/

使用元素ID填充jQuery UI自动完成列表

1 个答案: