码迷,mamicode.com
首页 > 其他好文 > 详细

AJAX封装

时间:2014-09-26 01:14:37      阅读:301      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   io   os   ar   for   数据   

php测试代码

<?php
    //echo Date(‘Y-m-d H:i:s‘);
    print_r($_GET);
    print_r($_POST);
    /*if($_GET[‘name‘] == ‘xiaofei‘){
        echo ‘小飞‘;
    }*/
    /*if($_POST[‘name‘] == ‘xiaofei‘){
        echo ‘小飞‘;
    }*/
?>

ajax封装代码

//封装ajax
function ajax(obj){
    var xhr = createXHR();
    obj.url = obj.url + ‘?rand=‘ + Math.random();
    obj.data = params(obj.data);
    if(obj.method === ‘get‘)obj.url += obj.url.indexOf(‘?‘)==-1 ? ‘?‘ + obj.data :‘&‘ + obj.data;
    if(obj.async === true){
        xhr.onreadystatechange = function(){
            if(xhr.readyState == 4){
                if(xhr.status == 200){
                    obj.success(xhr.responseText);            //回掉传递参数
                }else{
                    alert(‘获取数据错误!错误代号:‘+xhr.status+‘,错误信息:‘+xhr.statusText);
                }
            }
        }
    }
    
    xhr.open(obj.method,obj.url,obj.async);
    if(obj.method === ‘post‘){
        xhr.setRequestHeader(‘Content-Type‘,‘application/x-www-form-urlencoded‘);
        xhr.send(obj.data);
    }else{
        xhr.send(null);
    }
    if(obj.async === false){
        if(xhr.status == 200){
            obj.success(xhr.responseText);            //回掉传递参数
        }else{
            alert(‘获取数据错误!错误代号:‘+xhr.status+‘,错误信息:‘+xhr.statusText);
        }
    }
}

//调用ajax
addEvent(document,‘click‘,function(){
    ajax({
        method : ‘post‘,
        url : ‘demo.php‘,
        data : {
            ‘name‘ : ‘xiao&fei‘,
            ‘age‘ : 100
        },
        success : function(text){
            alert(text);
        },
        async : true
    });
});

//创建xhr
function createXHR(){
    if(typeof XMLHttpRequest != ‘undefined‘){
        return new XMLHttpRequest();
    }else if(typeof ActiveXObject() != ‘undefined‘){
        var version = [
            ‘MSXML2.XMLHttp.6.0‘,
            ‘MSXML2.XMLHttp.3.0‘,
            ‘MSXML2.XMLHttp‘
        ];
        for(var i = 0; i < version.length; i ++){
            try{
                return new ActiveXObject(version[i]);
            }catch(e){
                //跳过
            }
        }
    }else{
        throw new Error(‘您的系统不支持xhr对象!‘);
    }
}
//名值对转换成字符串
function params(data){
    var arr = [];
    for(var i in data){
        arr.push(encodeURIComponent(i) + ‘=‘ + encodeURIComponent(data[i]));
    }
    return arr.join(‘&‘);
}

//跨浏览器添加事件
function addEvent(obj,type,fn){
    if(obj.addEventListener){
        obj.addEventListener(type,fn,false);
    }else if(obj.attachEvent){
        obj.attachEvent(‘on‘+type,fn);
    }
}

 

AJAX封装

标签:style   blog   http   color   io   os   ar   for   数据   

原文地址:http://www.cnblogs.com/littlefly/p/3993837.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!