位置:电子教程 > ajax教程 (如果看不到内容请使用360浏览器) 推荐学习资源
AJAX 教程概要
AJAX 工作原理
创建 XMLHttpRequest 对象
XMLHttpRequest请求
XMLHttpRequest 服务器 响应
onreadystatechange 事件
AJAX PHP实例
AJAX 3级联动全国区域
当前阅读教程:ajax教程 > JS处理程序
阅读(22555525)      收藏       赞(5685)      分享
上一篇: 全国数据库表和效果图 下一篇: 调用2级地区PHP接口程序

代码如下

//创建xmlhttp对象
function createxmlhttp()
{
    var activeKey=new Array("MSXML2.XMLHTTP.5.0",
        "MSXML2.XMLHTTP.4.0",
        "MSXML2.XMLHTTP.3.0",
        "MSXML2.XMLHTTP",
        "Microsoft.XMLHTTP");
    if(window.ActiveXObject)
    {
        for(var i=0;i<activeKey.length;i++)
        {
            try
            {
                xmlHttp=new ActiveXObject(activeKey[i]);
                if(xmlHttp!=null)
                    return xmlHttp;
            }
            catch(error)
            {
                continue;
            }
        }
        throw new Error("客户端浏览器版本过低,不支持XMLHttpRequest对象,请更新浏览器");
    }
    else if(window.XMLHttpRequest)
    {
        //alert("3");
        xmlHttp=new window.XMLHttpRequest();
    }
    return xmlHttp;
}
 
//根据传入的省级id,通过接口获取对应的所属的2级地区(市|区)
function GetDiqu2(bigclassid){
    //alert(bigclassid); //用于测试弹出获取的1级地区的id
    if(bigclassid==0){//没有选择1级地区
        //没有选择1级地区,则默认显示下面内容
        document.getElementById("subclass2").innerHTML="<select name='select2'  onchange='get_j2(this.value);' ><option value='0'>地级</option></select>";
        return;//终止执行
    };
    var xmlhttpobj = createxmlhttp();
    if(xmlhttpobj){//如果创建对象xmlhttpobj成功
        //下面通过接口来获取2级地区的信息
        xmlhttpobj.open('get',"diqu2.php?bigclassid="+bigclassid+"&number="+Math.random(),true);//get方法 加个随机数。
        xmlhttpobj.send(null);
        xmlhttpobj.onreadystatechange=function(){//客户端监控函数
            if(xmlhttpobj.readystate==4){//服务器处理请求完成
                if(xmlhttpobj.status==200){ //ok
                    var html = xmlhttpobj.responseText;//获得返回值
                    document.getElementById("subclass2").innerHTML=html;//将返回值赋值给页面
                }else{
                    document.getElementById("subclass2").innerHTML="对不起,您请求的页面有问题...";
                }
            }else{
                document.getElementById("subclass2").innerHTML="加载中,请梢候...";//服务器处理中
                //var html = xmlhttpobj.responseText;//获得返回值
               // document.getElementById("subclass2").innerHTML=html;//将返回值赋值给页面
            }
        }
    }
}
 
//根据传入的2级地区id,通过接口获取对应的所属的3级地区(县|区)
function GetDiqu3(bigclassid){
    //alert(bigclassid); //用于测试弹出获取的2级地区的id
    if(bigclassid==0){//没有选择2级地区
        //没有选择2级地区,则默认显示下面内容
        document.getElementById("subclass3").innerHTML="<select name='select3'><option value='0'>县级</option></select>";
        return;//终止执行
    };
    var xmlhttpobj = createxmlhttp();
    if(xmlhttpobj){//如果创建对象xmlhttpobj成功
        //下面通过接口来获取3级地区的信息
        xmlhttpobj.open('get',"diqu3.php?bigclassid="+bigclassid+"&number="+Math.random(),true);//get方法 加个随机数。
        xmlhttpobj.send(null);
        xmlhttpobj.onreadystatechange=function(){//客户端监控函数
            if(xmlhttpobj.readystate==4){//服务器处理请求完成
                if(xmlhttpobj.status==200){//ok
                    var html = xmlhttpobj.responseText;//获得返回值
                    document.getElementById("subclass3").innerHTML=html;//将返回值赋值给页面
                }else{
                    document.getElementById("subclass3").innerHTML="对不起,您请求的页面有问题...";
                }
            }else{
                document.getElementById("subclass3").innerHTML="加载中,请梢候...";//服务器处理中
                //var html = xmlhttpobj.responseText;//获得返回值
                //document.getElementById("subclass3").innerHTML=html;//将返回值赋值给页面
            }
        }
    }
}


上一篇: 全国数据库表和效果图 下一篇: 调用2级地区PHP接口程序
计算机毕业设计作品网      毕业设计文档网      小程序教程网       毕业设计资料网  |         毕业设计定制QQ:45157718(微信同号)(备注:毕设)