<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>天气</title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="../css/mui.min.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="../css/mui.picker.css" />
<link rel="stylesheet" type="text/css" href="../css/mui.poppicker.css" />
<!--引入公用样式-->
<link rel="stylesheet" type="text/css" href="../css/public.css" />
<style>
html,
body {
background-color: #009be0 !important;
}
</style>
</head>
<body>
<div class="weather-box bs-bb">
<div class="wt-hb bs-bb dp-n" id="results">
<!--城市-->
<div class="citybox">
<span class="cityname c-ff smFontSize" id="city"></span>
</div>
<!--天气-->
<div class="wh-sk ta-c bs-bb">
<div class="wh-img bs-bb">
<img src="../images/weather/tq7.png" alt="" id="whimg" />
</div>
<div class="mui-row">
<div class="mui-col-xs-6 ta-r wh-msg wh-lmsg">
<span class="wh-bigFontSize c-ff" id="tmp"></span>
</div>
<div class="mui-col-xs-6 ta-l wh-msg wh-rmsg">
<div>
<span class="c-ff smFontSize">℃</span>
</div>
<div>
<span class="c-ff smFontSize" id="cond_txt"></span>
</div>
</div>
</div>
</div>
<!--详细信息-->
<div class="sixbox mui-row c-ff">
<div class="mui-col-xs-2 bs-bb">
<div class="ta-c">
<span class="smFontSize">体感</span>
</div>
<div class="ta-c">
<img class="xsimg" src="../images/tfwd.png" alt="" />
</div>
<div class="ta-c">
<span class="smFontSize" id="fl"></span>
</div>
</div>
<div class="mui-col-xs-2 bs-bb">
<div class="ta-c">
<span class="smFontSize">湿度</span>
</div>
<div class="ta-c">
<img class="xsimg" src="../images/sd.png" alt="" />
</div>
<div class="ta-c">
<span class="smFontSize" id="hum"></span>
</div>
</div>
<div class="mui-col-xs-2 bs-bb">
<div class="ta-c">
<span class="smFontSize">降水量</span>
</div>
<div class="ta-c">
<img class="xsimg" src="../images/jstj.png" alt="" />
</div>
<div class="ta-c">
<span class="smFontSize" id="pcpn"></span>
</div>
</div>
<div class="mui-col-xs-2 bs-bb">
<div class="ta-c">
<span class="smFontSize">风向</span>
</div>
<div class="ta-c">
<img class="xsimg" src="../images/fx.png" alt="" />
</div>
<div class="ta-c">
<span class="smFontSize" id="wind_dir"></span>
</div>
</div>
<div class="mui-col-xs-2 bs-bb">
<div class="ta-c">
<span class="smFontSize">风力</span>
</div>
<div class="ta-c">
<img class="xsimg" src="../images/fl.png" alt="" />
</div>
<div class="ta-c">
<span class="smFontSize" id="wind_sc"></span>
</div>
</div>
<div class="mui-col-xs-2 bs-bb">
<div class="ta-c">
<span class="smFontSize">风速</span>
</div>
<div class="ta-c">
<img class="xsimg" src="../images/fs.png" alt="" />
</div>
<div class="ta-c">
<span class="smFontSize" id="wind_spd"></span>
</div>
</div>
</div>
<!--分割线-->
<div class="fgx bs-bb">
<div></div>
</div>
<!--3-10天的天气-->
<div class="daymsg bs-bb">
<!--今天-->
<div class="bs-bb mui-row smFontSize daylist c-ff">
<div class="mui-col-xs-4">
<b>今天</b>
<span id="today"></span>
</div>
<div class="mui-col-xs-4 ta-c">
<span style="position: relative;">
<img class="listday" src="" alt="" id="todayimg"/>
</span>
<span id="todaytext"></span>
</div>
<div class="mui-col-xs-4 ta-r">
<span id="todaywd"></span>
</div>
</div>
<!--明天-->
<div class="bs-bb mui-row smFontSize daylist c-ff">
<div class="mui-col-xs-4">
<b>明天</b>
<span id="tomorrow"></span>
</div>
<div class="mui-col-xs-4 ta-c">
<span style="position: relative;">
<img class="listday" src="" alt="" id="tomorrowimg"/>
</span>
<span id="tomorrowtext"></span>
</div>
<div class="mui-col-xs-4 ta-r">
<span id="tomorrowwd"></span>
</div>
</div>
<!--后天-->
<div class="bs-bb mui-row smFontSize daylist c-ff">
<div class="mui-col-xs-4">
<b>后天</b>
<span id="afterTomorrow"></span>
</div>
<div class="mui-col-xs-4 ta-c">
<span style="position: relative;">
<img class="listday" src="" alt="" id="afterTomorrowimg"/>
</span>
<span id="afterTomorrowtext"></span>
</div>
<div class="mui-col-xs-4 ta-r">
<span id="afterTomorrowwd"></span>
</div>
</div>
</div>
</div>
</div>
<script src="../js/mui.min.js"></script>
<script src="../js/mui.picker.js"></script>
<script src="../js/mui.poppicker.js"></script>
<script src="../js/city.data-3.js"></script>
<script type="text/javascript">
mui.init();
//和风天气认证key 9aab750e479648829ea03e5646a3bc36
//实况天气
/* 实况：https://free-api.heweather.com/s6/weather/now?
* 3-10天：https://free-api.heweather.com/s6/weather/forecast?
* 逐小时预报：https://free-api.heweather.com/s6/weather/hourly?
* 生活指数：https://free-api.heweather.com/s6/weather/lifestyle?
*
* 例子
* https://free-api.heweather.com/s6/weather/now?key=9aab750e479648829ea03e5646a3bc36&location=北京
**/
//全局变量
mui.plusReady(function() {
//获取当前地理位置信息
plus.geolocation.getCurrentPosition(function(res) {
//alert(JSON.stringify(data))
console.log(JSON.stringify(res));
plus.nativeUI.showWaiting("加载中...");
//请求数据
var url = 'https://free-api.heweather.com/s6/weather/now?key=9aab750e479648829ea03e5646a3bc36&location=' + res.coords.longitude + ',' + res.coords.latitude;
mui.ajax(url, {
dataType: 'json', //服务器返回json格式数据
type: 'post', //HTTP请求类型
timeout: 10000, //超时时间设置为10秒；
headers: {
'Content-Type': 'application/json'
},
success: function(data) {
if(data.HeWeather6[0].status == "ok") {
var dz = data.HeWeather6[0].basic.admin_area + " " + data.HeWeather6[0].basic.parent_city + " " + data.HeWeather6[0].basic.location;
var data = data.HeWeather6[0].now;
//赋值
document.getElementById('whimg').setAttribute('src', '../images/weather1/' + data.cond_code + '.svg')
document.getElementById('city').innerText = dz;
document.getElementById('cond_txt').innerText = data.cond_txt;
document.getElementById('wind_dir').innerText = data.wind_dir;
document.getElementById('wind_sc').innerText = data.wind_sc;
document.getElementById('wind_spd').innerText = data.wind_spd;
document.getElementById('hum').innerText = data.hum;
document.getElementById('tmp').innerText = data.tmp;
document.getElementById('fl').innerText = data.fl;
document.getElementById('pcpn').innerText = data.pcpn;
//请求3-10天的天气信息
//请求数据
var url = 'https://free-api.heweather.com/s6/weather/forecast?key=9aab750e479648829ea03e5646a3bc36&location=' + res.coords.longitude + ',' + res.coords.latitude;
mui.ajax(url, {
dataType: 'json', //服务器返回json格式数据
type: 'post', //HTTP请求类型
timeout: 10000, //超时时间设置为10秒；
headers: {
'Content-Type': 'application/json'
},
success: function(res1) {
plus.nativeUI.closeWaiting();
if(res1.HeWeather6[0].status
基于HBuilder+mui搭建安卓项目贴身管家Android版 （247个子文件） 
H55C29548_0112122408.apk 4.04MB H55C29548_1207124512.apk 4.03MB H55C29548_1207125202.apk 4.03MB H55C29548_1207125320.apk 4.03MB H55C29548_1207140837.apk 4.03MB H55C29548_1206143603.apk 3.98MB H55C29548_1206140741.apk 3.98MB H55C29548_1205170414.apk 3.98MB H55C29548_1205170616.apk 3.98MB H55C29548_1205175611.apk 3.98MB H55C29548_1205172528.apk 3.98MB H55C29548_1206151821.apk 3.98MB .confirmed_dependencies 1KB mui.min.css 70KB public.css 8KB iconfont.css 4KB mui.picker.css 2KB mui.poppicker.css 1KB .dependencies 4B
bq1.gif 279KB bq4.gif 63KB bq3.gif 16KB bq2.gif 16KB
weather.html 15KB home-translation.html 8KB home-exchangeRate.html 7KB home.html 6KB home-figure.html 6KB home-ip.html 5KB home-identificationCard.html 5KB news.html 5KB home-banks.html 5KB main.html 5KB home-equipment.html 4KB home-belongingTo.html 4KB guidePage.html 3KB about-describe.html 3KB about-opinion.html 3KB about-about.html 3KB index.html 2KB about.html 2KB about-support.html 2KB home-providentFund.html 1KB home-expressDelivery.html 1KB home-publicTransport.html 1KB
EmptyBanner1.jpg 227KB EmptyBanner2.jpg 221KB EmptyBanner3.jpg 213KB bgimg2.jpg 189KB bgimg3.jpg 189KB bgimg1.jpg 180KB EmptyBanner.jpg 166KB bq5.jpg 73KB bq4.jpg 42KB bq3.jpg 15KB bq6.jpg 9KB wx.jpg 8KB bq2.jpg 6KB city.data-3.js 164KB mui.min.js 113KB zepto.js 57KB mui.picker.js 11KB md5.js 8KB mui.poppicker.js 5KB public.js 1KB immersed.js 934B figure.js 59B config.js 58B manifest.json 12KB LICENSE 1KB
EmptyBanner1.png 144KB wl.png 81KB 1080.png 71KB EmptyBanner3.png 55KB EmptyBanner2.png 47KB 720.png 33KB 480.png 20KB bq1.png 15KB 11.png 10KB logo.png 8KB 180x180.png 7KB 192x192.png 6KB kd.png 6KB 152x152.png 6KB 144x144.png 5KB EmptyBanner.png 4KB 256x256.png 4KB tq13.png 4KB 114x114.png 4KB 120x120.png 4KB tq7.png 4KB tq2.png 4KB 100x100.png 4KB tq5.png 4KB tq9.png 4KB sfz.png 4KB 96x96.png 3KB good.png 3KB wzj.png 3KB 87x87.png 3KB共 247 条
- 1
- 2
- 3
资源评论
Java程序员-张凯
- 粉丝: 1w+
- 资源: 7454
最新资源
- NSFileManagerOperationError如何解决.md
- FileExistsError.md
- NullPointerException如何解决.md
- 激光切割机3015 ug10全套技术资料100%好用.zip
- 二叉树的深度计算方法PDF
- BAT加密解密程序单纯的批处理代码
- Java+Swing+Mysql实现电影院票务管理系统（高分项目）
- 矿泉水瓶瓶装液体膜包机step全套技术资料100%好用.zip
- MemoryLeakError解决办法.md
- IndexOutOfBoundsException如何解决.md
- ReadOnlyBufferException(解决方案).md
- Python编程全面介绍：从基础知识到实用技巧
- Java+Swing+Mysql实现的图书借阅管理系统（98分大作业）
- 超市企业文化培训手册.ppt
- 陈德起：创建学习型组织.ppt
- 皓志集团《企业文化手册》.ppt
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
