ajax应用

ajax代码：

<script type="text/javascript">  
 
  //基础ajax应用
  var xmlHttpRequest = null; //声明一个空对象以接收XMLHttpRequest对象   
   function ajaxSubmit()
   {
    if(window.ActiveXObject) // IE浏览器
    {
     xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else if(window.XMLHttpRequest) //除IE外的其他浏览器实现
    {
     xmlHttpRequest = new XMLHttpRequest();
    }
    
    if(null != xmlHttpRequest)
    {
     var v1 = document.getElementById("username").value;
     
     xmlHttpRequest.open("POST", "ajaxServlet", true);
     //关联好ajax的回调函数
     xmlHttpRequest.onreadystatechange = ajaxCallback;
     //真正向服务器端发送数据
     // 使用post方式提交，必须要加上如下一行
     xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
     xmlHttpRequest.send("username=" + v1);        
    }
   }
   
   function ajaxCallback()
   {
    if(xmlHttpRequest.readyState == 4)
    {
     if(xmlHttpRequest.status == 200)
     {
      var responseText = xmlHttpRequest.responseText;
      
      document.getElementById("div1").innerHTML = responseText;
     }
    }
   }
 
   //jquery封装ajax的应用
   $(function(){
    $("#submit").click(function(){
     
     $.ajax({
      type:"post",
      url:"ajaxServlet",
      dataType:"text",
      data: {"username":$("#username").val()},
      success:function(returnedData){
       $("#div1").text(returnedData);
      }
      
     });
     
    })
    
   }) 
 </script>

 

html;

username:<input id="username" type="text"><br>
 <input type="button" value="获取姓名" id="submit">
          
  <div id="div1"></div>

 

servlet代码：

String username = req.getParameter("username");
  
  resp.setHeader("pragma", "no-cache");
  resp.setHeader("cache-control", "no-cache");
  
  PrintWriter out = resp.getWriter();
  
  out.println(username);