We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
最近,需要写一个请求实时气温的小demo,本来想在网上找一段代码,结果找了半天,也没个能用的,于是就自己写了一个。
在网上找代码的时候,我发现好多不能用的情况是因为提供数据的API接口不能访问了,于是就找了一个可以用的API接口:http://api.map.baidu.com/telematics/v3/weather?location=%E5%8C%97%E4%BA%AC&output=json&ak=yourkey,使用本接口有几个值得注意的地方:
$(function(){ $.ajax({ url: 'http://api.map.baidu.com/telematics/v3/weather?location=%E5%8C%97%E4%BA%AC&output=json&ak=你的ak码', dataType: 'jsonp', method: 'GET', success: function(data){ //处理数据的逻辑,以下是得到最高气温和最低气温的逻辑 var highTemp = '30'; var lowTemp = '7'; if(data.status === 'success'){ var results = data.results[0].weather_data[0], temp = results.temperature, tempArr = temp.match(/(\d{1,2})\s*~\s*(\d{1,2})/); highTemp = tempArr[1]; lowTemp = tempArr[2]; $('._weather_high_temp').html(highTemp + '°C'); $('._weather_low_temp').html(lowTemp + '°C'); } } } }) })
本来这个请求天气的小demo已经完成,但是自己又在想jQuery中的jsonp请求的方法太强大了,自己能不能用js来简单实现一下jsonp的方法呢,于是就试着简单写了一下:
/** * jsonp跨域方法实现. * @param url 请求路径 * @param callbackName 接口回调参数名 * @param callbackFnName 回调函数名 * @param callbackFn 回调函数 * @example 调用方式: * jsonp('http://api.map.baidu.com/telematics/v3/weather?location=%E5%8C%97%E4%BA%AC&output=json&ak=BE3c97a171552a6493f383049606f17a', "callback", 'weatherCB', function(data){ * console.log(data); * }); */ function jsonp(url, callbackName, callbackFnName, callbackFn) { var s = document.createElement("script"); s.src = !callbackName ? url : url + (url.indexOf("?") == -1 ? "?" : "&") + callbackName + "=" + callbackFnName; var timer = setInterval(function () { if (document.readyState === 'complete') { document.body.appendChild(s); clearInterval(timer); } }, 300); window[callbackFnName] = callbackFn; } jsonp('http://api.map.baidu.com/telematics/v3/weather?location=%E5%8C%97%E4%BA%AC&output=json&ak=BE3c97a171552a6493f383049606f17a', "callback", 'weatherCB', function(data){ console.log(data); });
经测试,自己写的jsonp方法是可以实现异步请求功能的,但是有许多的细节情况未考虑周到,只是一个简单实现,望补充指正。
The text was updated successfully, but these errors were encountered:
第一个程序报错了少了一个分号
Sorry, something went wrong.
@Grace-lekaro 其实应该是多写了一个大括号,分号理论上不是必须的
No branches or pull requests
js和jQuery跨域示例-请求实时天气
最近,需要写一个请求实时气温的小demo,本来想在网上找一段代码,结果找了半天,也没个能用的,于是就自己写了一个。
1、API接口
在网上找代码的时候,我发现好多不能用的情况是因为提供数据的API接口不能访问了,于是就找了一个可以用的API接口:http://api.map.baidu.com/telematics/v3/weather?location=%E5%8C%97%E4%BA%AC&output=json&ak=yourkey,使用本接口有几个值得注意的地方:
2、jquery实现请求数据
有了提供数据的API,用jQuery中的jsonp方式请求就很容易实现了,以下是代码:3、js实现jsonp方法
本来这个请求天气的小demo已经完成,但是自己又在想jQuery中的jsonp请求的方法太强大了,自己能不能用js来简单实现一下jsonp的方法呢,于是就试着简单写了一下:
小结
经测试,自己写的jsonp方法是可以实现异步请求功能的,但是有许多的细节情况未考虑周到,只是一个简单实现,望补充指正。
The text was updated successfully, but these errors were encountered: