软件开发培训班 >> 编程开发 >> JavaScript


AJAX据邮政编码自动完成城市和地址信息

　　本文标签：AJAX

　　描述：在注册或购物车结帐的时候，需要用户填入个人资料，这个环节可以简练一下，我们只需客人填入邮政编码，然后就根据这个邮政编码，自动从数据库中取出相应的省，市等地址信息  。

　　这样既可以减少客户的输入，增加客户体验，又可以减少由于资料输入而产生的错误  。

　　实现：

　　HTML

Enter A United States Zipcode, Then Tab














Enter Zipcode:
　　name="zipcode" onBlur="sndReq(this.value);"/>
City:
State:

　　以上是客户输入页面，下面是服务端的处理页面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];
}

　　最终的效果图：

(责任编辑：铭铭)