AJAX的POST提交数据方法

前端之家收集整理的这篇文章主要介绍了AJAX的POST提交数据方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

AJAX的POST提交数据方法

AJAX中POST使用?

在AJAX里,用POST提交数据是通过SEND的参数来传的。 <script type="text/javascript" language="javascript"> <!-- //创建xmlhttp函数 function CreateHTTPObject() {     var xmlhttp;     try     {         xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");     }     catch (e)     {         try         {             xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");         }         catch (e)         {             xmlhttp = false;         }     }     if (!xmlhttp && typeof XMLHttpRequest!='undefined')     {         try         {             xmlhttp = new XMLHttpRequest();         }         catch (e)         {             xmlhttp=false;         }     }     if (!xmlhttp && window.createRequest)     {         try         {             xmlhttp = window.createRequest();         }         catch (e)         {             xmlhttp=false;         }     }     return xmlhttp; } //使用全局变量 xmlhttp function OnReadyStateChng() {     if (xmlhttp.readyState == 0)     {         document.getElementById("board").innerHTML = "尚未初始化";     }     else if (xmlhttp.readyState == 1)     {         document.getElementById("board").innerHTML = "正在加载";     }     else if (xmlhttp.readyState == 2)     {         document.getElementById("board").innerHTML = "加载完毕";     }     else if (xmlhttp.readyState == 3)     {         document.getElementById("board").innerHTML = "正在处理";     }     else if (xmlhttp.readyState == 4)     {         document.getElementById("board").innerHTML = xmlhttp.responseText; //处理完毕     } } //这里正式开始 var xmlhttp = CreateHTTPObject(); if (xmlhttp) {     xmlhttp.open("POST","request.asp",true);     xmlhttp.onreadystatechange = OnReadyStateChng;     xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //这一句是用post方法发送的时候必须写的     xmlhttp.send("a="+encodeURIComponent("中国人")); } --> </script> 好了,就是这样,用POST时,很多人掉了xmlhttp.setRequestHeader这句,所以常出错? var postStr = "name="+ userName +"&age="+ userAge +"&sex="+ userSex; //实例化Ajax varajax= null; if(window.XMLHttpRequest){ ajax= new XMLHttpRequest(); } else if(window.ActiveXObject){ ajax= new ActiveXObject("Microsoft.XMLHTTP"); } else{ return; } //通过Post方式打开连接 ajax.open("POST",url,true); //定义传输的文件HTTP头信息 ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //发送POST数据 ajax.send(postStr); //返回数据的处理函数 ajax.onreadystatechange = function(){ if (ajax.readyState == 4 &&ajax.status == 200){ msg.innerHTML =ajax.responseText; } } } </SCRIPT> <form name="user_info"> 姓名:<input type="text" name="user_name" /><br/> 年龄:<input type="text" name="user_age" /><br/> 性别:<input type="text" name="user_sex" /><br/> <input type="button" value="提交表单" onClick="saveUserInfo()"> </form> //构建一个接受返回信息的层: <div id="msg"></div> 以下是改好的代码: <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org /TR/xhtml1/DTD/xhtml1- transitional.dtd"> <html xmlns=" http://www.w3.org /1999/xhtml"> <head> <Meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script type="text/javascript"> function ajaxLoad(){ var xmlHttp=false; if(window.XMLHttpRequest){ xmlHttp=new XMLHttpRequest(); xmlHttp.overrideMimeType("application/x-www-form-urlencoded"); } if(window.ActiveXObject){ try{ xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); }catch(e){ try{ xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){ alert("您的浏览器不支持AJAX"); } } if(xmlHttp){ xmlHttp.open("POST","ajax.asp"); xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xmlHttp.onreadystatechange=function(){ if(xmlHttp.readyState==4&&xmlHttp.status==200){ document.getElementById("block").innerHTML=xmlHttp.responseText; } } xmlHttp.send("username=dashu"); } } } </script> </head> <body> <span id="block"></span> <a onclick="ajaxLoad();">Click</a> </body> </html> 原文链接:https://www.f2er.com/ajax/163608.html

猜你在找的Ajax相关文章