Question

我有一个服务器返回的JSON格式，在文本框中输入了一些关键字：

[{"id":1,"value":"some string!"}]

我希望当用户选择一个项目时，浏览器会使用选择id导航到另一个页面;它存在于返回的JSON中。这是我的自动完整代码：

$(function () {

$("#search-box").autocomplete({
    source: function (request, response) {
        $.ajax({
            type: "GET",
            url: "../Contenthandler/Search.ashx",
            dataType: "json",
            data: 'query=' + request.term,
            success: function (data) {
                response($.map(data, function (item) {
                    return { label: item.value };
                })
       );

            }
        });
    },
    minLength: 3,
    open: function () {
        $(this).removeClass("ui-corner-all").addClass("ui-corner-top");
    },
    close: function () {
        $(this).removeClass("ui-corner-top").addClass("ui-corner-all");
    },
    select: function (event, ui) {
        if (ui.item) {
            window.location.href = "../ControlPanel.aspx?id=" + ui.item.id;
        }
    }
 });

});

但ui.item.id为undefined。如何在选择事件上访问id（1）？

Answer 1

您没有id作为您映射到数组的对象的属性，在您的ajax成功中传递给自动完成。

您的对象只有一个属性label。添加您需要的其他属性，或者只使用label属性

扩展您的响应对象

 response($.map(data, function (item) {
       return { label: item.value, id : item.id };// add "id" property
  });

实际上，如果从服务器返回的数据是最重要的结构......您不需要进行任何映射。你真的不需要你自己的ajax，可以直接将服务器路径连接到插件。

请参阅有关将url路径设置为源

的演示和文档

如何在自动完成选择中访问返回的JSON值？

1 个答案: