1

我有以下形式的 json 数组：

[{"label":<some-label>,"spellings":[<list of spellings>]}, ...]

我需要使用 jquery ui 自动完成来解析上面的数组。但是，有一些限制：

  1. 自动完成建议应该涉及“拼写”的匹配，但应该只建议相应的“标签”。例如，如果“标签”有 n 个“拼写”，那么自动完成应该只显示 n 个“拼写”的特定“标签”。
  2. 从提供的建议中选择时，相应的“标签”应仅反映在文本输入框中。

我应该如何进行？任何指针？

而且，如何迭代相应“标签”的“拼写”列表？

这就是我正在尝试做的，但给出了乱码输出。

var labels = []
var values = [] 
$.getJSON($url, function(data) { 
  $.each(data, function(key, val) { 
    for (var v in val.value)
      values.push(val.value[v])
    labels.push(val.label)
}); 
$("#text1").autocomplete({ 
  minLength: 2, 
  source: values, 
  focus: function(event, ui) { 
    $("#text1").val(ui.item.label); 
    return false; 
  }, 
  select: function(event, ui) { 
    $("#text1").val(ui.item.label); 
    return false; 
  } 
});
});
4

1 回答 1

5

我会建立一个项目的单一源数组，每个拼写一个，其中label属性是每个拼写的标签，value属性是拼写本身。这将使您能够快速过滤结果，而无需遍历每个对象的spelling数组并检查可能需要一段时间的匹配项。

然后，在您定义的函数中source，您可以执行自己的过滤逻辑，只允许建议列表中每个“标签”的一个实例。

像这样的东西应该可以工作（请注意，自动完成是在$.getJSON回调内部初始化的。这是确保在初始化小部件之前加载源数据所必需的）：

$.getJSON($url, function(data) {
    $.each(data, function (i, el) {
        source.push({ label: el.label, value: el.label });

        $.each(el.spellings, function (j, spelling) {
            source.push({ label: el.label, value: spelling });
        });
    });

    /* initialize the autocomplete widget: */
    $("input").autocomplete({
        source: function (request, response) {
            var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i")
                , results = [];

            /* Make sure each entry is only in the suggestions list once: */
            $.each(source, function (i, value) {
                if (matcher.test(value.value) && $.inArray(value.label, results) < 0) {
                    results.push(value.label);
                }
            });
            response(results);
        }
    });
});

示例：http: //jsfiddle.net/MaMZt/

于 2012-08-08T16:26:21.127 回答