|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>使用Ajax获得天气信息</title>
<script type="text/javascript" language="javascript">
function getXMLRequester( ){
var xmlhttp_request = false;
try{
if( window.ActiveXObject ){
for( var i = 5; i; i-- ){
try{
if( i == 2 ){xmlhttp_request = new ActiveXObject( "Microsoft.XMLHTTP" );
}else{xmlhttp_request = new ActiveXObject( "Msxml2.XMLHTTP." + i + ".0" );
xmlhttp_request.setRequestHeader("Content-Type","text/xml");xmlhttp_request.setRequestHeader("Content-Type","gb2312");
}
break;}
catch(e){
xmlhttp_request = false;
}
}
}else if( window.XMLHttpRequest ){
xmlhttp_request = new XMLHttpRequest();
if (xmlhttp_request.overrideMimeType) {
xmlhttp_request.overrideMimeType('text/xml');
}
}
}
catch(e){
xmlhttp_request = false;
}
return xmlhttp_request ;
}
function IDRequest(n) {
//定义收到服务器的响应后需要执行的JavaScript函数
url=n+document.getElementById('weatherid').value;//定义网址参数
alert(url);
xmlhttp_request=getXMLRequester();//调用创建XMLHttpRequest的函数
xmlhttp_request.onreadystatechange = doContents;//调用doContents函数
xmlhttp_request.open('GET', url, true);
xmlhttp_request.send(null);
}
function doContents() {
if (xmlhttp_request.readyState == 4) {// 收到完整的服务器响应
if (xmlhttp_request.status == 200) {//HTTP服务器响应的值OK
document.getElementById('message').innerHTML = xmlhttp_request.responseText;//将服务器返回的字符串写到页面中ID为message的区域
} else {
alert(http_request.status);
}
}
}
//
</script>
</head>
<body>
<input type="text" id="weatherid" />
<input type="button" value="校验" onclick="IDRequest('http://weather.tq121.com.cn/mapanel/index1_new.php?city=')" />
<div id="message"></div></body>
</html>
view不够好,有兴趣的朋友可以做一下.
做好最后的效果图:
|
发布一个获取天气信息的ajax应用
一共有 7 条评论
MSN:flag100200@hotmail.com