论坛登陆 用户名:  密 码:
设为首页  加入收藏
08年北京名校秋季招生
名牌院校免试入学宽进严出,突破考分限制,名校与你零距离,以下院校按报名先后顺序录取,24小时网上报名覆盖全国
  您现在的位置: 中国教育招生在线 >> IT >> JAVA认证 >> IT正文
AJAX实例:根据邮编自动完成地址信息
 作者:佚名     2007-3-14 17:34:39        来源:不详  浏览次数:

 

 

 

 

 

 

 

 

描述:

在注册或购物车结帐的时候,需要用户填入个人资料,这个环节可以简练一下,我们只需客人填入邮政编码,然后就根据这个邮政编码,自动从数据库中取出相应的省,市等地址信息。这样既可以减少客户的输入,增加客户体验,又可以减少由于资料输入而产生的错误。

实现:

HTML
<script>
function createRequestObject() {
var ro;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
ro = new ActiveXObject("Microsoft.XMLHTTP");
}else{
ro = new XMLHttpRequest();
}
return ro;
}
var http = createRequestObject();
function sndReq(zip) {
http.open('get', 'zipcode.php?zip='+zip);
http.onreadystatechange = handleResponse;
http.send(null);
}
function handleResponse() {
if(http.readyState == 4){
var response = http.responseText;
var update = new Array();
if(response.indexOf('|' != -1)) {
update = response.split('|');
document.getElementById("city").value = update[0];
document.getElementById("state").value = update[1];
}
}
}
</script>
<h3>Enter A United States Zipcode, Then Tab</h3>
<table align="center">
<tr>
<td>Enter Zipcode:</td>
<td><input type="text" id="zipcode" name="zipcode" onBlur="sndReq(this.value);"/></td>
</tr>
<tr>
<td>City:</td>
<td><input type="text" id="city" name="city"/></td>
</tr>
<tr>
<td>State:</td>
<td><input type="text" id="state" name="state"/></td>
</tr>
</table>

以上是客户输入页面,下面是服务端的处理页面'zipcode.php

$dbuser = 'root';
$dbpass = '111111';
$cn = mysql_connect("localhost", $dbuser, $dbpass);
$db = mysql_select_db("ajax");
$sql = "select city, state from zipcodes where zipcode = " . $_REQUEST['zip'];
$rs = mysql_query($sql);
$row = mysql_fetch_array($rs);
echo $row['city'] . "|" . $row['state'];
mysql_close($cn);
?>

当客户输入一个POSTCODE后,zipcode.php就接收到它,然后进行从数据表中取出对应的资料,再按一定的格式返回给客户端(此处是以 | 分隔)。最后客户端接收返回的资料,显示在页面上。

if(response.indexOf('|' != -1)) {
update = response.split('|');
document.getElementById("city").value = update[0];
document.getElementById("state").value = update[1];
}


责任编辑:lss
  相关新闻
Java模板引擎Velocity基本语法
【JAVA基础】JDBC连接DB2数据库详解
为什么要学习Java,成为Java程序员
Java基础-漫谈EJB在Java中的应用
漫谈EJB在Java中的应用(二)
J2EE技术-漫谈EJB在Java中的应用
JAVA测试:使用JMock来实现孤立测试
看看如何在Struts应用中施展AJAX魔法
通过java.net.Socket类抓取网页内容
精华:AJAX开发简略 (第二部分)
为什么要学习Java,成为Java程序员
Java基础-漫谈EJB在Java中的应用
漫谈EJB在Java中的应用(二)
运用Jakarta Struts的七大实战心法
通过Java Swing 看透MVC设计模式
开发保留标准浏览器功能的AJAX应用程序
Web框架趣谈之Java Web 框架的甜点
Web2.0时代的核心应用:Ajax简介
精华:AJAX开发简略(第一部分)
Thinking in AJAX(三)——AJAX框架汇总
  评论
现在有100人对本文发表评论
查看所有评论
 
推  荐
 
100本成功必读热销书
热门招生
  北京文理研修学院   前进大学
  北京明园大学   北京建设大学
  北京邮电大学世纪学院   北方工商管理学院
  联想软件定向委培班   香港数码动画学院
  青年企业管理研修学院   北京华夏管理学院
热门培训
网络化办公专家培训认证 电子科技大学软件学院
软件测试工程师培训认证 北大青鸟十大授权培训
IT硬件工程师培训认证班 北京环球雅思荷兰预科
JAVA开发工程师培训 潜能时代IT服务管理培训
网络信息化工程师培训 清华大学继续教育学院
论坛精选
 
有些细节是男人也该注意的风度!最容易读错的字
某强人手机里保存的30条短信 中国十大高薪职业
最感人的十大韩剧经典台词 嫁给工程师的N个理由
爆强!只有一句话的鬼故事 转贴教你如何做妖精
 女人一定要記住的話 女人最好别嫁给最爱的男人
城市联盟
 大连 上海 天津 广州 西安 深圳  天津  青岛  大连  福州  沈阳  青海  连云港  南京  吉林  厦门  威海  辽宁  呼和浩特
Copyright © 2006   www.edu999.com   All rights reserved. 中国教育招生在线  版权所有
北京市通信管理局[2004]字第552号函    京ICP证040442号