Question

我需要以下代码的帮助。

$("#auto_cp").autocomplete({
    minLength: 3,
    //source
    source: function(req, add) {
        $.getJSON("friends.php?callback=?", req, function(data) {
            var suggestions = [];
            $.each(data, function(i, val) {
                suggestions.push(val.name);
            });
            add(suggestions);
        });
    },
    //select
    select: function(e, ui) {
        alert(ui.item.value);
    }
});

使用FireBug，我在我的控制台中得到了这个：

jQuery171003666625335785867_1337116004522（[{ “名称”：“97300 卡宴 “ ”ZZZ“： ”203“}，{ ”名“：” 97311 Roura“，”zzz“：”201“}，{”name“：”97312 Saint Elie“，”zzz“：”388“}，{”name“：”97320 Saint Laurent du 马罗尼 “ ”ZZZ“： ”391“}，{ ”名“：” 97351 Matoury“，”zzz“：”52“}，{”name“：”97354 Remire MontJoly Cayenne“，”zzz“：”69“}，{”name“：”97355 Macouria Tonate“，”zzz“：”449“}）

一切都很好，但我不知道如何在选择项目上获得'zzz'的价值。

我试过

alert(ui.item.zzz);

但它不起作用。

Answer 1

自动完成小部件需要数组格式的数据源：

包含标签属性，值属性或两者兼有的对象
简单字符串值

您当前正在构建第二个（字符串值数组），它可以正常工作，但您也可以在迭代数据时略微调整数据，并提供对象中的其他属性：

$("#auto_cp").autocomplete({
    minLength: 3,
    //source
    source: function(req, add) {
        $.getJSON("friends.php?callback=?", req, function(data) {
            var suggestions = [];
            $.each(data, function(i, val) {
                suggestions.push({
                    label: val.name,
                    zzz: val.zzz
                });
            });
            add(suggestions);
        });
    },
    //select
    select: function(e, ui) {
        alert(ui.item.zzz);
    }
});

现在，由于您提供窗口小部件的数组包含具有名称属性的对象，因此您应该获得自动完成功能，并且还可以访问zzz属性。

以下是一个工作示例（没有AJAX调用）：http://jsfiddle.net/LY42X/

Answer 2

你的源函数只填充名称。如果您需要该数据结构中的所有内容，请执行以下操作：

$("#auto_cp").autocomplete({
    minLength: 3,
    //source
    source: function(req, add) {
        $.getJSON("friends.php?callback=?", req, function(data) {
            var suggestions = [];
            $.each(data, function(i, val) {
                suggestions.push(val); //not val.name
            });
            add(suggestions);
        });
    },
    //select
    select: function(e, ui) {
        alert(ui.item.value.zzz);
    }
});

Answer 3

这似乎是一系列对象......您可能缺少的是“[0]”或一般“[index]”。

请检查：jqueryui.com/demos/autocomplete/#event-select

Jquery UI自动完成选择

3 个答案: