javascript 之发送非表单数据时进行编码

在使用 ajax 给后台发送表单数据的时候,需要对数据进行 URL 编码,如下:

find=pizza&zipcode=0123&radius=1km
  

但是有时候,有可能给后台发送的是一个 javascript 对象,这个对象可能是:

{
    find:"pizza",
    zipcode:0123,
    radius:"1km"
}
  

这时就需要对对象属性进行编码:

//编码对象的属性
function encodeFormData(data){
    if(!data) return ""; //一直返回字符串
    var pairs = []; //为了保存名=值对
    for(var name in data){
        if(!data.hasOwnProperty(name)) continue; //跳过继承属性
        if(typeof data[name] === "function") continue; //跳过方法
        var value = data[name].toString(); //把值转换成字符串
        name = encodeURIComponent(name.replace("%20","+")); //编码名字,这里把空格替换为+
        value = encodeURIComponent(value.replace("%20","+")); //编码值,这里把空格替换为+
        pairs.push(name + "=" + value); //记住名=值对
    }
    return pairs.join('&'); //返回使用"&"连接的名/值对
}

//ajax 发送数据
function postData(url,data,callback){
    var request = new XMLHttpRequest();
    request.open("POST",url);
    request.onreadystatechange = function(){ //设置 http 请求状态改变的事件触发器
        if(request.readyState === 4 && status === 200){ //判断 HTTP 请求状态和 HTTP 状态码
            if(callback){
                callback(request); //回调函数
            }
        }
    }
    request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    request.send(encodeFormData(data));
}