为搜索按钮绑定处理方法:
$(function() {
$('#btnSearch').click(function() {
//这里调用最关键的Search方法,取数据
Search();
});
});
下面来看最关键的Search部分,调用API获取结果数据:
$(function() {
function Search() {
//获取用户输入的搜索词,并替换空格为“+”
var searchTerms = $('#txtQuery').val().replace(" ", "+");
//将接口需要的所有参数封装为数组
var arr = [AppId, Query + searchTerms, Sources, Version, Market, Options, "Web.Count=" + WebCount, "Web.Offset=" + WebOffset, "JsonType=callback", "JsonCallback=?"];
//将参数数组拼装成url串,最终得到bing的URL Service的请求URL
var requestStr = "http://api.search.live.net/json.aspx?" + arr.join("&");
//通过jquery ajax调用bing json数据接口
$.ajax({
type: "GET",
url: requestStr,
//指定数据类型为jsonp
dataType: "jsonp",
//调用成功后返回数据对象,并调用处理方法
success: function(msg) {
SearchCompleted(msg);
},
error: function(msg) {
alert("Something hasn't worked\n" + msg.d);
}
});
}
});
我们看到在使用jquery ajax时,指定数据类型为jsonp,jsonp是一种可跨域访问的协议,我对其也不是非常清楚,可以在这里了解一下。另外 CSS9.NET 也计划在后面的文章中讲解json的相关知识,敬请关注。
再来看获取到数据后的UI处理,主要包括显示结果和显示错误信息两部分:
function SearchCompleted(response) {
//检查结果数据对象中的Errors对象,判断是否发生错误
var errors = response.SearchResponse.Errors;
if (errors != null) {
// 发生错误的话调用错误信息显示方法
DisplayErrors(errors);
}
else {
// 没有错误的话调用结果信息显示方法
DisplayResults(response);
}
}
更多的Bing API的简单了解请到论坛查看: http://BBS.TC711.COM
【 双击滚屏 】 【 评论 】 【 收藏 】 【 打印 】 【 关闭 】
来源:
互联网
日期:2009-7-2