PHP+ajax实现的省市联动功能

这篇文章主要介绍了php+原生态ajax实现的省市联动功能,较为详细的分析了ajax交互的原理、实现方法以及php结合ajax实现省市联动下拉菜单功能的相关操作技巧,需要的朋友可以参考下

具体如下：

Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。

XMLHttpRequest

XMLHttpRequest对象在大部分浏览器上已经实现而且拥有一个简单的接口允许数据从客户端传递到服务端，但并不会打断用户当前的操作。使用XMLHttpRequest传送的数据可以是任何格式，虽然从名字上建议是XML格式的数据。

立即学习“PHP免费学习笔记（深入）”；

开发人员应该已经熟悉了许多其他XML相关的技术。XPath可以访问XML文档中的数据，但理解XML DOM是必须的。类似的，XSLT是最简单而快速的从XML数据生成HTML或XML的方式。许多开发人员已经熟悉Xpath和XSLT，因此AJAX选择XML作为数据交换格式是有意义的。XSLT可以被用在客户端和服务端，它能够减少大量的用JavaScript编写的应用逻辑。
对于Internet Explorer浏览器：

Internet 5.0-6.0:

xmlhttp_request = new ActiveXObject("Msxml2.XMLHTTP.3.0"); //3.0或4.0,5.0
xmlhttp_request = new ActiveXObject("Msxml2.XMLHTTP");
xmlhttp_request = new ActiveXObject("Microsoft.XMLHTTP");

Internet 7.0及以上:

xmlhttp_request = new XMLHttpRequest();

自动判断的代码:

var xmlhttp;
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
  xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

在实际应用中，为了兼容多种不同版本的浏览器，一般将创建XMLHttpRequest类的方法写成如下形式：

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("Charset", "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;
}

发送请求

可以调用HTTP请求类的open()和send()方法，如下所示：

xmlhttp_request.open('GET',URL,true);
xmlhttp_request.send(null);

open()的第一个参数是HTTP请求方式—GET，POST或任何服务器所支持的您想调用的方式。按照HTTP规范，该参数要大写；否则，某些浏览器(如Firefox)可能无法处理请求。

第二个参数是请求页面的URL。

第三个参数设置请求是否为异步模式。如果是TRUE，JavaScript函数将继续执行，而不等待服务器响应。这就是"AJAX"中的"A"。

服务器的响应

这需要告诉HTTP请求对象用哪一个JavaScript函数处理这个响应。可以将对象的onreadystatechange属性设置为要使用的JavaScript的函数名，如下所示：

xmlhttp_request.onreadystatechange =FunctionName;

FunctionName是用JavaScript创建的函数名，注意不要写成FunctionName()，当然我们也可以直接将JavaScript代码创建在onreadystatechange之后，例如：

xmlhttp_request.onreadystatechange = function(){
// JavaScript代码段
};

首先要检查请求的状态。只有当一个完整的服务器响应已经收到了，函数才可以处理该响应。XMLHttpRequest 提供了readyState属性来对服务器响应进行判断。

readyState的取值如下：

Select2实现的省市区三级联动

Select2实现的省市区三级联动

下载

0 (未初始化)
1 (正在装载)
2 (装载完毕)
3 (交互中)
4 (完成)

所以只有当readyState=4时，一个完整的服务器响应已经收到了，函数才可以处理该响应。具体代码如下：

if (http_request.readyState == 4) {
// 收到完整的服务器响应
}else {
// 没有收到完整的服务器响应
}

当readyState=4时，一个完整的服务器响应已经收到了，接着，函数会检查HTTP服务器响应的状态值。完整的状态取值可参见W3C文档。当HTTP服务器响应的值为200时，表示状态正常。

处理从服务器得到的数据

有两种方式可以得到这些数据：

(1) 以文本字符串的方式返回服务器的响应
(2) 以XMLDocument对象方式返回响应

应用程序架构应用程序框架

(小例子一)---------demo5.php--get传值方式

 
  
 
 
 

  用户名 

  密码 

   

 

 

demo51_do.php

(小例子二)

post传值方式demo6.php

 
  
 
 
 

  用户名 

  密码 

   

 

 

demo6_do.php

(小例子三)----xml

demo7.php

 
  
 
 
 

  省
  
    --请选择--
    --河北--
    --河南--
    --广东--
  
  市
  
    --请选择--
  
 

 

demo7_do.php

石家庄保定沧州";
}else if($shen == "2"){
 $city = "郑州新乡登封";
}else if($shen == "3"){
 $city = "东莞中山广州";
}
echo $city;
?>

相关推荐：

Ajax PHP无刷新二级联动下拉菜单(省市联动)源码_PHP教程

用Ajax写的省市联动，修改时如何显示地址里已有的省和市

ajax-ecshop手机端省市联动bug