如何在jQuery Autocomplete中使用含别名的字典实现匹配？

你需要将别名整合到包含ID、值的单个字典数组中，实现通过值或别名进行搜索，同时在选中时能获取对应条目的ID。以下是改造后的实现代码：

var dict = [
    {key:'1', value:'United States of America', alias:'usa'},
    {key:'2', value:'United Kingdom', alias:'uk'},
    {key:'3', value:'South Africa', alias:'sa'}
];

$("#txtValue").autocomplete({
    source: function(request, response) {
        // 转义搜索关键词，避免正则特殊字符干扰
        var term = $.ui.autocomplete.escapeRegex(request.term);
        // 构建不区分大小写的前缀匹配正则
        var matcher = new RegExp("^" + term, "i");
        
        // 过滤字典数组，匹配正式名称或别名
        var matchedItems = $.grep(dict, function(item) {
            return matcher.test(item.value) || matcher.test(item.alias);
        });
        
        // 将匹配结果转换为Autocomplete所需格式
        response($.map(matchedItems, function(item) {
            return {
                label: item.value, // 下拉列表显示的文本
                value: item.value, // 选中后填充到输入框的文本
                key: item.key      // 自定义ID字段
            };
        }));
    },
    select: function(event, ui) {
        // 选中时输出对应条目ID
        console.log(ui.item.key);
    }
});

关键逻辑说明 #

• 安全匹配：先对搜索关键词做转义处理，避免正则特殊字符导致的匹配异常。
• 双重匹配规则：通过$.grep遍历数组，同时检查条目正式名称（value）和别名（alias）是否匹配搜索词。
• 结果格式化：用$.map将匹配条目转换为Autocomplete要求的结构，保留自定义的key字段用于后续ID获取。

内容的提问来源于stack exchange，提问作者Eric Smith