AJAX提交方法（POST）Demon

时间 2019-11-18

标签 ajax 提交方法 post demon 栏目 Ajax 繁體版

原文原文链接

　　AJAX的POST提交方法，本质上来看和GET差很少，有些细小的区别，POST要提交数据时，须要setRequestHeader()方法来提交HTTP头，而后send()方法中提交数据（格式为："?str=String&str2=String2"）；str和str2为变量名，String和String2为要发送的值。javascript

　　其余与Get差很少。html

　　下面是一个发送并接收username和password的Demon，先建立一个.html文件，名称随意，代码以下：java

  <body>
  <script type="text/javascript" src="1.js"></script>
    用户名称：<input type="text" id="username" /><br />
   用户密码：<input type="password" id="password" /><br />
 <input type="button" onclick="fun();" value="提交"> <br/>
 <p id="txt"></p>
  </body>

　　接着来建立1.js的Javascript文件，要和.html在同一目录下，代码以下：web

function fun(){
    if(window.XMLHttpRequest){
        xmlhttp = new XMLHttpRequest();
    }else if(window.ActiveXObject){
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }else{
        alert("对象没法被构建");
    }
    
    username = document.getElementById("username").value;
    password = document.getElementById("password").value;
    
    xmlhttp.onreadystatechange = handchange;
    xmlhttp.open("POST","Servlet1?username="+username+"&password="+password,true);
    xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");  //设置的HTTP头
    xmlhttp.send("task=task&msg=msg");  //此处只是为了证实send()的使用方法，无心义
}

function handchange(){
    if(xmlhttp.readyState == 4){
        if(xmlhttp.status == 200){
            document.getElementById("txt").innerHTML = xmlhttp.responseText;
        }
    }else{
        document.getElementById("txt").innerHTML = "耐心等待...";
    }
}

　　下面建立一个Servlet注意在web.xml里面的映射名称要和xmlhttp.open("POST","Servlet1?username="+username+"&password="+password,true);此处的Servlet1一致。app

　　Servlet1，doPost代码以下：url

response.setContentType("text/html");
        response.setCharacterEncoding("UTF-8");
        PrintWriter out = response.getWriter();
        String username = new String(request.getParameter("username").getBytes("ISO-8859-1"),"UTF-8");
        String password = new String(request.getParameter("password").getBytes("ISO-8859-1"),"UTF-8");
        String task = new String(request.getParameter("task").getBytes("ISO-8859-1"),"UTF-8");
        String msg = new String(request.getParameter("msg").getBytes("ISO-8859-1"),"UTF-8");
        
        System.out.println(username+""+password);
        if(task.equals("task")){
            if(msg.equals("msg")){
                out.println(username+""+password);//send()如果成功传入了数据则，在.html也面中显示输入的值
            }
        }

　　截图以下：spa

输入数据，点击提交，截图以下：code