将两个JQuery.Map合并为一个?

时间:2013-09-03 19:00:41

标签: jquery json jquery-ui merge

我正在调查spotify网络服务,以便在我的个人应用程序中搜索艺术家和曲目。

问题是我想在一个对象中显示两个不同的结果。

这可能吗?

或者我应该以不同的方式接近? (在这种情况下让我走上正轨)。

也许我应该对网络服务进行嵌套调用?(请写一些代码,我自己尝试过,但我真的不知道如何正确使用它)

Jsfiddle的可读性和演示:http://jsfiddle.net/a97Ys/

以下代码

function GetTracks(request, response) {
        $.get("http://ws.spotify.com/search/1/track.json", {
            q: request.term
        }, function (data) {
            response($.map(data.tracks.slice(0, 5), function (item) {
                return { label: item.name, by: item.artists[0].name, category: "Track" };
            }));
        });    
}

function GetArtist(request, response) {
    $.get("http://ws.spotify.com/search/1/artist.json", {
        q: request.term
    }, function (data) {
        response($.map(data.artists.slice(0, 5), function (item) {
            return { label: item.name, by: "", category: "Artist" };
        }));
    });
}

这个功能是我遇到的问题:

$(function () {
    $("#ListenToInput").catcomplete({
        delay: 0,
        source: function (request, response) {           
            //...Combine two maps and return one object ...//
        }
    });
});

1 个答案:

答案 0 :(得分:1)

当您使用自动完成功能时,最好保留一个本地缓存变量来存储结果。您可以使用相同的缓存来组合轨道和艺术家搜索结果,如下所示:

var cache = {};

function GetTracks(request, response) {
    $.get("http://ws.spotify.com/search/1/track.json", {
        q: request.term
    }, function (data) {
        $.merge(cache[request.term], 
        $.map(data.tracks.slice(0, 5), function (item) {
            return {
                label: item.name,
                by: item.artists[0].name,
                category: "Track"
            };
        }));
        response(cache[request.term]);
    });
}

function GetArtist(request, response) {
    $.get("http://ws.spotify.com/search/1/artist.json", {
        q: request.term
    }, function (data) {
        $.merge(cache[request.term], 
        $.map(data.artists.slice(0, 5), function (item) {
            return {
                label: item.name,
                by: "",
                category: "Artist"
            };
        }));
        response(cache[request.term]);
    });
}

$(function () {
    $("#ListenToInput").catcomplete({
        delay: 0,
        source: function (request, response) {
            if (cache[request.term]) {
                return response(cache[request.term]);
            } else {
                cache[request.term] = [];
                GetTracks(request, response);
                GetArtist(request, response);
            }
        }
    });
});

如果响应函数被调用两次,自动完成似乎不会抱怨。

http://jsfiddle.net/jk9s2/