因为最近做的一个小东西用到了,看到网上专门对ajax的post方式讲解的不太多,就自己贴些demo的code给大家看下。至于为何不用GET方式就不再赘述了。详见代码。呵呵
网页code:
<html> <head> <meta http-equiv="Content-Language" content="en" /> <meta name="GENERATOR" content="Zend Studio" /> <meta http-equiv="Content-Type" content="text/html; charset=gbk" /> <title>ajax运用post方式传递多值异步操作</title> </head> <body bgcolor="#FFFFFF" text="#000000" link="#FF9966" vlink="#FF9966" alink="#FFCC99"> <input type="button" id="vote" οnclick="postaction('联想','thinkpad系列','商务最佳伴侣','http://www.yafei.tk');" value="点我吧"> <!--<span id="show"></span>--> </body> </html>
<script> function createObject() { var objXMLHttp=null; if (window.XMLHttpRequest) { objXMLHttp=new XMLHttpRequest(); } else if (window.ActiveXObject) { objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP"); } return objXMLHttp; } var xmlHttp = null; function cardAction(product,linkurl) { xmlHttp = createObject(); url="logvote.php"; xmlHttp.open("POST",url,true); xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xmlHttp.send("model="+product+"&voteurl="+linkurl);//运用ajax post多个值时,也是拼接字符串,但是我们制定POST方式。 xmlHttp.onreadystatechange=stateChanged; } function stateChanged() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { if (xmlHttp.responseText != "") { document.getElementById("show").innerHTML=xmlHttp.responseText; } else { document.getElementById("show").innerHTML="错误!"; } } } </script>
<script type="text/javascript">
function postaction(brand,product,getname,linkurl){ cardAction(product,linkurl); var speak="恭喜"+brand+"品牌的"+product+"产品获得了"+getname+"的称号!" //定义转发字符串 var _url = encodeURIComponent(document.location); // var _appkey = encodeURI("appkey"); // var _pic = encodeURI('http://www.baidu.com/img/baidu_sylogo1.gif'); //可以穿过来图片url地址进行转发的 var _site = ''; //网站地址 var _u = 'http://service.t.sina.com.cn/share/share.php?url=&URL&&appkey=&title=&COUPLETS&&pic=&PIC&&ralateUid=' _u = _u.replace("&URL&", _url); //网站地址 // _u = _u.replace("&PIC&", _pic); // 所生成的图片的url地址, _u = _u.replace("&COUPLETS&", speak); window.open(_u, '', 'width=700, height=500, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, location=yes, resizable=no, status=no'); } </script> |