|
下面是顯示結(jié)果方法，因?yàn)橐淖僓I，所以代碼多一點(diǎn)，不過(guò)這里可以感受一下jquery中dom操作的靈活。
function DisplayResults(response) {
//清空結(jié)果列表
$("#result-list").html("");
//清空翻頁(yè)導(dǎo)航
$("#result-navigation li").filter(".nav-page").remove();
// 清空結(jié)果描述信息
$("#result-aggregates").children().remove();
//獲取結(jié)果數(shù)據(jù)對(duì)象
var results = response.SearchResponse.Web.Results;
//描述信息部分，即總過(guò)多少條，當(dāng)前是哪些條
$('#result-aggregates').prepend("<p>檢索詞： " + response.SearchResponse.Query.SearchTerms + "</p>");
$('#result-aggregates').prepend("<p id=\"result-count\">當(dāng)前顯示 " + StartOffset(results)
+ " 至 " + EndOffset(results)
+ " 總共:" + parseInt(response.SearchResponse.Web.Total) + "</p>");
//創(chuàng)建結(jié)果列表，把每一項(xiàng)要顯示的內(nèi)容放在一個(gè)數(shù)組中
var link = [];
//因?yàn)殚_(kāi)啟了搜索詞高亮選項(xiàng)，這里進(jìn)行高亮匹配
var regexBegin = new RegExp("\uE000", "g");
var regexEnd = new RegExp("\uE001", "g");
for (var i = 0; i < results.length; ++i) {
//創(chuàng)建每一結(jié)果項(xiàng)的信息
link[i] = "<li><a href=\"" + results[i].Url + "\" title=\"" + results[i].Title + "\">"
+ results[i].Title + "</a>"
+ "<p>" + results[i].Description + "<p>"
+ "<p class=\"result-url\">" + results[i].Url + "</p></li>";
//搜索詞加粗顯示
link[i] = link[i].replace(regexBegin, "<strong>").replace(regexEnd, "</strong>");
}
//在頁(yè)面結(jié)果區(qū)域顯示結(jié)果列表
$("#result-list").html(link.join(''));
//處理導(dǎo)航區(qū)域
CreateNavigation(response.SearchResponse.Web.Total, results.length);
}
導(dǎo)航部分代碼比較簡(jiǎn)單，就不在這里大塊的貼了，直接下載代碼看吧。
下載：示例源碼
另外，在MSDN的bing api部分為開(kāi)發(fā)者提供了非常多的代碼實(shí)例，感興趣的可以去看。
原文：http://css9.net/jquery-ajax-bing-api-search/
本文鏈接：http://m.95time.cn/tech/web/2009/6836.asp 
出處：css9.net
責(zé)任編輯：bluehearts
上一頁(yè) jQuery+Bing API實(shí)現(xiàn)簡(jiǎn)易搜索引擎 [2] 下一頁(yè)
◎進(jìn)入論壇網(wǎng)頁(yè)制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評(píng)論。
|
第 1 頁(yè) 
第 3 頁(yè) jQuery+Bing API實(shí)現(xiàn)簡(jiǎn)易搜索引擎 [3]
