当前位置:编程学习 > 网站相关 >>

ajax心得3--编写ajax同用工具代码以及案例分析

[html]  
1. 初始化XMLHttpRequest对象模版  
function   createXmlHttpRequest(){  
   var xmlHttp;  
   try{    //Firefox, Opera 8.0+, Safari  
           xmlHttp=new XMLHttpRequest();  
    }catch (e){  
           try{    //Internet Explorer  
                  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");  
            }catch (e){  
                  try{  
                          xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");  
                  }catch (e){}    
           }  
    }  
   return xmlHttp;  
 }  
2.手动编写ajax通用工具代码  
//通过id获取dom对象  
function $(id) {  
    return document.getElementById(id);  
}  
  
// ajax技术必须创建XMLHTTPRequest对象 ,获取XMLHTTPRequest对象的操作  
function createXHR() {  
    var xhr;  
    var aVersion = [ "MSXML2.XMLHttp.5.0", "MSXML2.XMLHttp.4.0",  
            "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp", "Microsoft.XMLHttp" ];  
    try {  
        // 高版本ie、firefox、opera等浏览器直接new出ajax对象  
        xhr = new XMLHttpRequest();  
    } catch (e) {  
        // 低版本的IE,ie6以下版本需要通过以下操作创建ajax对象  
        for ( var i = 0; i < aVersion.length; i++) {  
            try {  
                xhr = new ActiveXObject(aVersion[i]);  
                return xhr;  
            } catch (e) {  
                continue;  
            }  
        }  
    }  
    return xhr;  
}  
3.ajax处理分页技术案例  
window.onload = function() {  
    // 获取按钮对象  
    var queryBtnDom = $("queryBtn");  
  
    // 给按钮设置点击事件操作  
    queryBtnDom.onclick = function() {  
  
        var content = "pagination.nowPage=" + 1;  
        var url = "./csdn/UserAction_query.action?time=" + new Date().getTime();  
        // 调用ajax处理过的请求发送操作  
        sendPost(content, url, managerSuccess, managerFail);  
  
        // 处理成功的方法  
        function managerSuccess(xhr) {  
            // 创建出XML dom对象  
            var XMLDom = xhr.responseXML;  
            // 创建xml的跟对象  
            var root = XMLDom.documentElement;  
            // 获取跟对象的子节点  
            var users = root.getElementsByTagName("user");  
            // 显示数据操作  
            showUsers(users);  
  
            // 分页操作  
            // 首页  
            $("firstPage").onclick = function() {  
                // 给请求的数据重新设一下值,然后重新发送一回请求  
                content = "pagination.nowPage=" + 1;  
                sendPost(content, url, managerSuccess, managerFail);  
            };  
            // 上一页  
            $("backPage").onclick = function() {  
                // 给请求的数据重新设一下值,然后重新发送一回请求  
                content = "pagination.nowPage="  
                        + eval(root.getAttribute("nowPage") + "-" + 1);  
                sendPost(content, url, managerSuccess, managerFail);  
  
            };  
            // 下一页  
            $("nextPage").onclick = function() {  
                // 给请求的数据重新设一下值,然后重新发送一回请求  
                content = "pagination.nowPage="  
                        + eval(root.getAttribute("nowPage") + "+" + 1);  
                sendPost(content, url, managerSuccess, managerFail);  
  
            };  
            // 末页  
            $("lastPage").onclick = function() {  
                // 给请求的数据重新设一下值,然后重新发送一回请求  
                content = "pagination.nowPage="  
                        + root.getAttribute("countPage");  
                sendPost(content, url, managerSuccess, managerFail);  
            };  
        }  
  
        function managerFail(xhr) {  
            alert("处理失败");  
        }  
  
    };  <
补充:Web开发 , 其他 ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,