Ajax进阶二：发送POST请求

来源：互联网发布：mac必备软件知乎编辑：程序博客网时间：2024/06/05 20:00

（1）对于Ajax的post请求，他与get请求的区别就是需要设置请求头和参数，其他部分和get请求一样。实例代码如下（判断form表单里面的账号密码是否已经注册）：

 <script type="text/javascript">  //创建获取xmlhttprequest的函数  function createXmlHttpRequest(){ try {        return new XMLHttpRequest();//大多数浏览器    } catch (e) {        try {            return ActvieXObject("Msxml2.XMLHTTP");//IE6.0        } catch (e) {            try {                return ActvieXObject("Microsoft.XMLHTTP");//IE5.5及更早版本              } catch (e) {                alert("哥们儿，您用的是什么浏览器啊？");                throw e;            }        }    }  } window.onload = function() {    // 获取文本框，给它的失去焦点事件注册监听    var userEle = document.getElementById("xxx");    //注册失去焦点的事件    userEle.onblur = function() {        //1.得到异步对象        var xmlHttp = createXmlHttpRequest();        //2.打开连接        xmlHttp.open("POST", "/AjaxWeb/Bservlert", true);        //3.设置请求头：Content-Type        xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");        //4.发送请求，给出请求体        xmlHttp.send("name=" + userEle.value);        //5.给xmlHttp的onreadystatechange事件注册监听        xmlHttp.onreadystatechange = function() {            if(xmlHttp.readyState == 4 && xmlHttp.status == 200) {//双重判断                //获取服务器的响应，判断是否为1                // 是：获取span，添加内容：“用户名已被注册”                var text = xmlHttp.responseText;                var span = document.getElementById("span");                alert(text);                if(text == "2") {                    //得到span元素                    span.innerHTML = "用户名已被注册！";                } else {                    span.innerHTML = "";                }            }        };    };};  </script>  <body>  <form method="post" action="/AjaxWeb/Bservlert">姓名：<input type="text" name="name" id="xxx"/><span id="span"></span><br>密码：<input type="password" name="password"/><br><input type="submit" id="btn" value="提交"></form>

阅读全文

0 0