我需要将搜索结果div仅显示在何时返回搜索结果(而不是在用户搜索术语时),然后能够在搜索新术语时清除结果div。
我应该可以使用类似$(".results").empty()
的内容,但这会使结果div始终为空。
$("#searchterm").keyup(function(e) {
var q = $("#searchterm").val();
//Only begin search with at least 3 characters.
if (q.length > 3) {
ajax_search();
}
//Send search query
function ajax_search() {
$.getJSON("//url-to-search?q=" + q, {},
//Get results and make 'em look good
function(data) {
console.log(data);
// $(".results").append("Results for <b> " + q + "</b>");
$.each(data.data, function(i, data) {
if (data.type === "category-1") {
if ($(".category-1").text() == '') {
$(".category-1-results-header, .category-1").hide()
}
$(".category-1").append("<li class='result-item'><a href=\"localhost:4000" + data.permalink + "\">" + data.title + "</a></li>");
} else if (data.type === "category-2") {
$(".category-2").append("<li class='result-item'><a href=\"localhost:4000" + data.permalink + "\">" + data.title + "</a></li>");
if ($(".category-2").text() == '') {
$(".category-2-results-header, .category-2").hide()
}
} else if (data.type === "category-3") {
$(".category-3").append("<li class='result-item'><a href=\"localhost:4000" + data.permalink + "\">" + data.title + "</a></li>");
if ($(".category-3").text() == '') {
$(".category-3-results-header, .category-3").hide()
}
}
});
});
}
});
JSFIDDLE:LINK
答案 0 :(得分:0)
尝试做类似
的事情if (q.length > 3) {
ajax_search();
} else {
$(".results").empty();
}