PHP+AJAX无刷新返回天气预报
<?php
header("Content-Type:text/html;charset=utf-8");
?>
<html>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<head>
<title>weather forecast天气预报--www.jbxue.com</title>
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript">
function $(id){
return document.getElementById(id);
}
function getCityId(){
var http_request=createAjax();
var url="weatherforecast.php"
var data="cityid="+$("cityId").value;
http_request.onreadystatechange=getWetherInfo;
http_request.open("post",url,true);
http_request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
http_request.send(data);
function getWetherInfo(){
if(http_request.readyState==4 && http_request.status==200){
var info=http_request.responseText;
$("weatherinfo").innerHTML=info;
}
}
}
</script>
</head>
<body>
<select name="cityId" onchange="getCityId();" id="cityId">
<option>--请选择城市--</option>
<option value="101010100">北京</option>
<option value="101020100">上海</option>
<option value="101030100">天津</option>
<option value="101040100">重庆</option>
<option value="101280101">广州</option>
</select>
<span id="weatherinfo"></span>
</body> </html>
<?php
header("Content-Type:text/html;charset=utf-8");
header("Cache-Control:no-cache");
if (isset($_POST['cityid'])){
$cityid=$_POST['cityid'];
$url=$url="http://www.weather.com.cn/data/sk/".$cityid.".html";
}else {
$url="http://www.weather.com.cn/data/sk/101010100.html";
}
$weatherInfo_json=file_get_contents($url);
$weatherInfo=json_decode($weatherInfo_json,true);
$cityName=$weatherInfo['weatherinfo']['city'];
$cityTemp=$weatherInfo['weatherinfo']['temp'];
$cityWd=$weatherInfo['weatherinfo']['WD'];
$cityWs=$weatherInfo['weatherinfo']['WS'];
$cityTime=$weatherInfo['weatherinfo']['time'];
$citySD=$weatherInfo['weatherinfo']['SD'];
echo $weatherinfo="城市名字：$cityName,气温：$cityTemp,风向：$cityWd";
?>
PHP+AJAX无刷新返回天气预报的更多相关文章
- ajax完成list无刷新返回
ajax完成list无刷新返回 ajax无刷新技术总结,以下是一段我写的ajax应用的js脚本.其中提交的data刚开始我采用的是$('#formId').serialize();但是出现乱码问题,为 ...
- ajax无刷新获取天气信息
浏览器由于安全方面的问题,禁止ajax跨域请求其他网站的数据,但是可以再本地的服务器上获取其他服务器的信息,在通过ajax请求本地服务来实现: <?php header("conten ...
- 移动端图片上传解决方案localResizeIMG先压缩后ajax无刷新上传
现在科技太发达,移动设备像素越来越高,随便一张照片2M+,但是要做移动端图片上传和pc上略有不同,移动端你不能去限制图片大小,让用户先处理图片再上传,这样不现实.所以理解的解决方案就是在上传先进行图片 ...
- ajax 无刷新分页
//ajax 无刷新分页1.前台要做的 滑动时 当前page+1,通过page ajax请求后台接口获取数据将数据进行拼装;2.后台要做的 做分页接口返回json数据前台判断触发请求条件: var p ...
- thinkphp ajax 无刷新分页效果的实现
思路:先做出传统分页效果,然后重新复制一份Page.class.php类,对它进行修改,把js中的函数传到page类中,把上一页.下一页.首页.尾页.链接页中的url地址改成js控制的函数,模板页面中 ...
- DWZ框架Ajax无刷新表单提交处理流程
DWZ框架Ajax无刷新表单提交处理流程是: 1. ajax表单提交给服务器 2. 服务器返回一个固定格式json结构 3. js会调函数根据这个json数据做相应 ...
- Thinkphp框架 -- ajax无刷新上传图片
用Thinkphp框架做无刷新上传图片 视图层 View <!doctype html> <html lang="en"> <head> < ...
- ajaxfileupload.js插件结合一般处理文件实现Ajax无刷新上传
先上几张图更直观展示一下要实现的功能.本功能主要通过Jquery ajaxfileupload.js插件结合ajaxUpFile.ashx一般应用程序处理文件实现Ajax无刷新上传功能,结合NPOI2 ...
- TP3.2：实现Ajax无刷新上传图片
1.基于TP3.2+ajaxfileupload进行无刷新上传图片,本次只上传一张,多张以后搞出来再发 2.效果: 3.html代码: <html> <head> < ...
随机推荐
- LineNumberReader类的使用
package com.lk.C; import java.io.IOException; import java.io.LineNumberReader; import java.io.PrintW ...
- JdbcTemplate 、NamedParameterJdbcTemplate、SimpleJdbcTemplate的区别
一.JdbcTemplate 首先在配置文件中设置数据源 <bean id="dataSource" class="org.springframework.jdbc ...
- 业务系统的JVM启动参数推荐
关键业务系统的JVM启动参数推荐,原文链接请参见:http://calvin1978.blogcn.com/articles/jvmoption-2.html
- FreeBSD 路由详解
在同一个局域网上的计算机是直接连通的,但是不同的网络上的计算机并没有直接相连,只能通过一台特殊的专用计算机 -路由器来完成连通.路由器连接有多个网络界面,每一个网络界面连接到一个相应的网络上,具有一个 ...
- MongoDB - MongoDB CRUD Operations
CRUD operations create, read, update, and delete documents. Create Operations Create or insert opera ...
- .NET DLL 保护措施详解(五)常规条件下的破解
为了证实在常规手段破解下能有效保护程序核心功能(演示版本对AES加解密算法及数据库的密钥(一段字符串)进行了保护),特对此DLL保护思路进行相应的测试,包含了反编译及反射测试,看是否能得到AES加解密 ...
- Every student in every school should have the opportunity to learn to code
“I think everybody in this country should learn how to program a computerbecause it teaches you how ...
- OpenGl从零开始之坐标变换
http://www.tuicool.com/articles/uiayYrI OpenGL学习脚印: 坐标变换过程(vertex transformation) http://blog.csdn.n ...
- MVC常用 ActionResult
1.EmptyResult 2.ContentResult 3.FileResult 4.JavaScriptResult 5.JsonResult 6.HttpStatusCodeResult 7. ...
- 20150309--gridview
GridView: 使用代码套用模板,变为DataList的样式,添加<asp:TemplateField>标签,(注意必须加上<Columns>) <asp:GridV ...