Ajax实现城市二级联动（三）

本文实例为大家分享了Ajax实现城市二级联动的具体代码，供大家参考，具体内容如下

这是Ajax实现城市二级联动系列文章第三篇，把之前2篇整合在一起

1、html

 请选择
 
 
 请选择
 

2、javascript

//创建获取ajax核心对象的函数
  function getXhr(){
   var xhr = null;
   if(window.XMLHttpRequest){
    xhr = new XMLHttpRequest();
   }else{
    xhr = new ActiveXObject("Microsoft.XMLHttp");
   }
   return xhr;
  }
  var xhr = getXhr();
  // 第一次执行Ajax异步请求 - 省份
  window.onload = function(){
   xhr.open("get","finaly.php?state=1");
   xhr.send(null);
   xhr.onreadystatechange = function(){
   if(xhr.readyState==4&&xhr.status==200){
     var data = xhr.responseText;
     // 将字符串转换为数组
     var provinces = data.split(",");
     // 遍历数组
     for(var i=0;i0;z--){
    city.removeChild(opts[z]);
   }
   if(province.value != "请选择"){
    xhr.open("post","finaly.php");
    xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    xhr.send("state=2&province="+province.value);
    xhr.onreadystatechange = function(){
     if(xhr.readyState==4&&xhr.status==200){
      var data = xhr.responseText;
      var cities = data.split(",");
      for(var i=0;i

3、finaly.php




以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。