我有一个实时的ajax搜索,并试图将结果分为两类,这是工作。我遇到的问题是当我输入或删除字符时,列表结果会增加相同的项而不是定义。结果的数量也以一种非常奇怪的方式显示出来。
$("#searchterm").keyup(function (e) {
var q = $("#searchterm").val();
$.getJSON('https://www.googleapis.com/books/v1/volumes?q=:isbn=0-13-727827-6',
function (data) {
$("#results").empty();
$("#results").append("Results for <b>" + q + "</b>");
$.each(data.items, function (i, item) {
var title = item.volumeInfo.title;
$.each(item.volumeInfo.industryIdentifiers, function (i2, type) {
$("<div/>")
.append(title)
.appendTo("div[id='" + type.type + "']");
$(".number").append(" total " + type.type.length);
});
});
});
});
请查看小提琴 http://jsfiddle.net/sFn8t/ ,随时修改,以便其他人可以使用它作为示例。提前谢谢。
答案 0 :(得分:0)
我已设法修改代码并使其正常工作。请关注我的更新小提琴 - 我希望它对像我这样的初学者会有所帮助。
$("#searchterm").keyup(function (e) {
var q = $("#searchterm").val();
$.getJSON('https://www.googleapis.com/books/v1/volumes?q=:' + q,
function (data) {
var tmp = {};
$.each(data.items, function (i, item) {
var type = item.volumeInfo.industryIdentifiers[0].type;
if (!tmp[type]) {
tmp[type] = [];
}
tmp[type].push(item);
});
var html = [];
$.each(tmp, function (key, item) {
html.push('<h3>' + key + ' - ');
html.push(item.length + '</h3><ul>');
$.each(item, function (i, val) {
html.push('<li><a href="page/?id=' + val.id + '"><strong>' + val.volumeInfo.title + '</strong></li></a>');
});
html.push('</ul>');
});
$('#results').html(html.join(''));
});
});