()post

()get

function serializeElement(element) {

var method = element.tagName.toLowerCase();

var parameter = input(element);

if (parameter) {

var key = encodeURIComponent(parameter[0]);

if (key.length == 0) return;

if (parameter[1].constructor != Array)

parameter[1] = [parameter[1]];


var values = parameter[1];

var results = [];

for (var i=0; i<values.length; i++) {

results.push(key + '=' + encodeURIComponent(values[i]));

}

return results.join('&');

}

}


function serializeForm(formId) {

var elements = getElements(formId);

var queryComponents = new Array();

for (var i = 0; i < elements.length; i++) {

var queryComponent = serializeElement(elements[i]);

if (queryComponent)

queryComponents.push(queryComponent);

}

return queryComponents.join('&');

}

() get,post 的区别

http://bbs.phpchina.com/thread-138396-1-1.html 一般不用get 而用post的原因

学习 Ajax 那么多的理论，这里有两个不错的 Ajax Post 与 Get 的实例，让我们去学习下吧。

先是学习 Ajax 的 Post，程序效果请参看 Ajax 的 Post 传值。


​​01​​

<html>


​​02​​

<head>


​​03​​

<meta http-equiv="Content-Type"content="text/html; charset=utf-8"/>


​​04​​

<title>Ajax Post 传值</title>


​​05​​

</head>


​​06​​



​​07​​

<script language="javascript">


​​08​​

functionsaveUserInfo()


​​09​​

{


​​10​​

    //获取接受返回信息层


​​11​​

    varmsg = document.getElementById("msg");


​​12​​



​​13​​

    //获取表单对象和用户信息值


​​14​​

    varf = document.user_info;


​​15​​

    varuserName = f.user_name.value;


​​16​​

    varuserAge   = f.user_age.value;


​​17​​

    varuserSex   = f.user_sex.value;


​​18​​



​​19​​

    //接收表单的URL地址


​​20​​

    varurl = "ajax_output1.php";


​​21​​



​​22​​

    //需要POST的值，把每个变量都通过&来联接


​​23​​

    varpostStr   = "user_name="+ userName +"&user_age="+ userAge +"&user_sex="+ userSex;


​​24​​



​​25​​

    //实例化Ajax


​​26​​

    //var ajax = InitAjax();


​​27​​



​​28​​



​​29​​

    varajax = false;


​​30​​

    //开始初始化XMLHttpRequest对象


​​31​​

    if(window.XMLHttpRequest)


​​32​​

    {   //Mozilla 浏览器


​​33​​

        ajax = newXMLHttpRequest();


​​34​​

        if(ajax.overrideMimeType)


​​35​​

        {   //设置MiME类别


​​36​​

            ajax.overrideMimeType("text/xml");


​​37​​

        }


​​38​​

    }


​​39​​

    elseif(window.ActiveXObject)


​​40​​

    {   // IE浏览器


​​41​​

        try


​​42​​

        {


​​43​​

            ajax = newActiveXObject("Msxml2.XMLHTTP");


​​44​​

        }


​​45​​

        catch(e)


​​46​​

        {


​​47​​

            try


​​48​​

            {


​​49​​

                ajax = newActiveXObject("Microsoft.XMLHTTP");


​​50​​

            }


​​51​​

            catch(e) {}


​​52​​

         }


​​53​​

    }


​​54​​

    if(!ajax)


​​55​​

    {   // 异常，创建对象实例失败


​​56​​

        window.alert("不能创建XMLHttpRequest对象实例.");


​​57​​

        returnfalse;


​​58​​

    }


​​59​​



​​60​​

    //通过Post方式打开连接


​​61​​

    ajax.open("POST", url, true);


​​62​​



​​63​​

    //定义传输的文件HTTP头信息


​​64​​

    ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");


​​65​​



​​66​​

    //发送POST数据


​​67​​

    ajax.send(postStr);


​​68​​



​​69​​

    //获取执行状态


​​70​​

    ajax.onreadystatechange = function()


​​71​​

    {


​​72​​

        //如果执行状态成功，那么就把返回信息写到指定的层里


​​73​​

        if(ajax.readyState == 4 && ajax.status == 200)


​​74​​

        {


​​75​​

            msg.innerHTML = ajax.responseText;


​​76​​

        }


​​77​​

    }


​​78​​

}


​​79​​

</script>


​​80​​



​​81​​

<body >


​​82​​

<div id="msg"></div>


​​83​​

<form name="user_info"method="post"action="">


​​84​​

姓名：<input type="text"name="user_name"/><br />


​​85​​

年龄：<input type="text"name="user_age"/><br />


​​86​​

性别：<input type="text"name="user_sex"/><br />


​​87​​

<input type="button"value="提交表单"onClick="saveUserInfo()">


​​88​​

</form>


​​89​​

</body>


​​90​​

</html>


然后是 Ajax 的 Get，用途是从服务器获取值。

程序效果请参看 ​​Ajax 的 Get 传值​​。

​​view source​​

​​print​​​​?​​

​​01​​

<html>


​​02​​

<head>


​​03​​

<meta http-equiv="Content-Type"content="text/html; charset=utf-8"/>


​​04​​

<title>Ajax Get 传值</title>


​​05​​

</head>


​​06​​



​​07​​

<script language="javascript">


​​08​​

functionsaveUserInfo()


​​09​​

{


​​10​​

    //获取接受返回信息层


​​11​​

    varmsg = document.getElementById("msg");


​​12​​



​​13​​

    //获取表单对象和用户信息值


​​14​​

    varf = document.user_info;


​​15​​

    varuserName  = f.user_name.value;


​​16​​

    varuserAge   = f.user_age.value;


​​17​​

    varuserSex   = f.user_sex.value;


​​18​​



​​19​​

    //接收表单的URL地址


​​20​​

    varurl = "ajax_output2.php? user_name="+ userName +"&user_age="+ userAge +"&user_sex="+ userSex;


​​21​​



​​22​​

    //实例化Ajax


​​23​​

    //var ajax = InitAjax();


​​24​​



​​25​​

    varajax = false;


​​26​​

    //开始初始化XMLHttpRequest对象


​​27​​

    if(window.XMLHttpRequest)


​​28​​

    {


​​29​​

        //Mozilla 浏览器


​​30​​

        ajax = newXMLHttpRequest();


​​31​​

        if(ajax.overrideMimeType)


​​32​​

        {//设置MiME类别


​​33​​

            ajax.overrideMimeType("text/xml");


​​34​​

        }


​​35​​

    }


​​36​​

    elseif(window.ActiveXObject)


​​37​​

    {   // IE浏览器


​​38​​

        try


​​39​​

        {


​​40​​

            ajax = newActiveXObject("Msxml2.XMLHTTP");


​​41​​

        }


​​42​​

        catch(e)


​​43​​

        {


​​44​​

            try


​​45​​

            {


​​46​​

                ajax = newActiveXObject("Microsoft.XMLHTTP");


​​47​​

            } catch(e) {}


​​48​​

        }


​​49​​

    }


​​50​​

    if(!ajax)


​​51​​

    {  


​​52​​

        // 异常，创建对象实例失败


​​53​​

        window.alert("不能创建XMLHttpRequest对象实例.");


​​54​​

        returnfalse;


​​55​​

    }              


​​56​​



​​57​​

    //通过Post方式打开连接


​​58​​

    ajax.open("GET", url, true);


​​59​​



​​60​​

    //发送GET数据,已经在URL中赋了值所以send那里只要加个空参.


​​61​​

    ajax.send(null);


​​62​​



​​63​​

    //获取执行状态


​​64​​

    ajax.onreadystatechange = function()


​​65​​

    {


​​66​​

        //如果执行状态成功，那么就把返回信息写到指定的层里


​​67​​

        if(ajax.readyState == 4 && ajax.status == 200)


​​68​​

        {


​​69​​

            msg.innerHTML = ajax.responseText;


​​70​​

        }


​​71​​

    }


​​72​​

}


​​73​​

</script>


​​74​​



​​75​​

<body>


​​76​​

<div id="msg"></div>


​​77​​

<form name="user_info"method="post"action="">


​​78​​

<input type="text"name="user_name"style="display:none;"/>


​​79​​

<input type="text"name="user_age"style="display:none;"/>


​​80​​

<input type="text"name="user_sex"style="display:none;"/>


​​81​​

<input type="button"value="获取服务器变量"onClick="saveUserInfo()">


​​82​​

</form>


​​83​​

</body>


ajax_output2.php


​​1​​

<?


​​2​​

     $user_name= "Gonn";


​​3​​

     echo$user_name;


​​4​​

     $user_age= "24";


​​5​​

     echo$user_age;


​​6​​

     $user_sex= "Man";


​​7​​

     echo$user_sex;


​​8​​

?>