ajax发送get、post请求

前端之家收集整理的这篇文章主要介绍了ajax发送get、post请求前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

ajax可以发送post或者get请求,并且可以设置同步或者异步,这里罗列了几种。其中,后台处理请求由servlet实现。

第一种方式:

[javascript] view plain copy print ?
  1. @H_403_19@var@H_403_19@xmlhttp=new@H_403_19@XMLHttpRequest();
  2. @H_403_19@//发送post请求,false表示发送同步请求@H_403_19@
  3. @H_403_19@xmlhttp.open("POST"@H_403_19@,"AdminLogin"@H_403_19@,false@H_403_19@);
  4. @H_403_19@//设置文件的头,UTF-8应与html编码格式一致,告诉浏览器对参数编码的格式,可以解决中文传输乱码的问题@H_403_19@
  5. @H_403_19@xmlhttp.setRequestHeader("Content-type"@H_403_19@,"application/x-www-form-urlencoded;charset=UTF-8"@H_403_19@);
  6. @H_403_19@//设置传递的参数@H_403_19@
  7. @H_403_19@xmlhttp.send("id="@H_403_19@+id+"&password="@H_403_19@+password);
  8. @H_403_19@//显示返回结果@H_403_19@
  9. @H_403_19@alert(xmlhttp.responseText);


第二种方式(接受JSON包):

[javascript] view plain copy print ?
  1. @H_403_19@//使用ajax方法,JS代码@H_403_19@
  2. @H_403_19@$.ajax({
  3. @H_403_19@url:"GetStudentInfo"@H_403_19@,
  4. @H_403_19@type:'POST'@H_403_19@,
  5. @H_403_19@async:false@H_403_19@,
  6. @H_403_19@contentType:'application/json'@H_403_19@,
  7. @H_403_19@mimeType:'application/json'@H_403_19@,
  8. @H_403_19@success:function@H_403_19@(data){//对返回值的处理@H_403_19@
  9. @H_403_19@$("#id"@H_403_19@).val(data.id);
  10. @H_403_19@$("#name"@H_403_19@).val(data.name);
  11. @H_403_19@$("#year"@H_403_19@).val(data.year);
  12. @H_403_19@$("#specialty"@H_403_19@).val(data.specialty);
  13. @H_403_19@$("#phone"@H_403_19@).val(data.phone);
  14. @H_403_19@$("#email"@H_403_19@).val(data.email);
  15. @H_403_19@},
  16. @H_403_19@});

  1. @H_403_19@//Servlet代码@H_403_19@
  2. @H_403_19@public@H_403_19@class@H_403_19@User{
  3. @H_403_19@public@H_403_19@Stringid;
  4. @H_403_19@public@H_403_19@Stringname;
  5. @H_403_19@public@H_403_19@Stringyear;
  6. @H_403_19@public@H_403_19@Stringspecialty;
  7. @H_403_19@public@H_403_19@Stringphone;
  8. @H_403_19@public@H_403_19@Stringemail;
  9. @H_403_19@}
  10. @H_403_19@
  11. @H_403_19@protected@H_403_19@void@H_403_19@doPost(HttpServletRequestrequest,HttpServletResponseresponse)
  12. @H_403_19@throws@H_403_19@ServletException,IOException{
  13. @H_403_19@ObjectMappermapper=new@H_403_19@ObjectMapper();
  14. @H_403_19@Connectioncon=DBTool.getConnection();
  15. @H_403_19@Useru=new@H_403_19@User();
  16. @H_403_19@u.id="a"@H_403_19@;
  17. @H_403_19@u.name="b"@H_403_19@;
  18. @H_403_19@u.year="c"@H_403_19@;
  19. @H_403_19@u.specialty="d"@H_403_19@;
  20. @H_403_19@u.phone="e"@H_403_19@;
  21. @H_403_19@u.email="f"@H_403_19@;
  22. @H_403_19@response.setContentType("application/json"@H_403_19@);
  23. @H_403_19@}

第三种方式(接受JSON包,返回值为集合):
[javascript] view plain copy print ?
  1. @H_403_19@//JS代码@H_403_19@
  2. @H_403_19@$.ajax({
  3. @H_403_19@url:"CheckAllStudent"@H_403_19@,
  4. @H_403_19@contentType:'application/json'@H_403_19@,
  5. @H_403_19@mimeType:'application/json'@H_403_19@,
  6. @H_403_19@success:function@H_403_19@(data){
  7. @H_403_19@$.each(data,function@H_403_19@(index,student){
  8. @H_403_19@var@H_403_19@string="<tr>"@H_403_19@;
  9. @H_403_19@string+="<td>"@H_403_19@+student.id+"</td>"@H_403_19@;
  10. @H_403_19@string+="<td>"@H_403_19@+student.name+"</td>"@H_403_19@;
  11. @H_403_19@string+="<td>"@H_403_19@+student.year+"</td>"@H_403_19@;
  12. @H_403_19@string+="<td>"@H_403_19@+student.specialty+"</td>"@H_403_19@;
  13. @H_403_19@string+="<td>"@H_403_19@+student.phone+"</td>"@H_403_19@;
  14. @H_403_19@string+="<td>"@H_403_19@+student.email+"</td>"@H_403_19@;
  15. @H_403_19@$("tbody"@H_403_19@).append(string);
  16. @H_403_19@});
  17. @H_403_19@},
  18. @H_403_19@});
  1. @H_403_19@//Servlet代码@H_403_19@
  2. @H_403_19@protected@H_403_19@void@H_403_19@doPost(HttpServletRequestrequest,HttpServletResponseresponse)
  3. @H_403_19@throws@H_403_19@ServletException,IOException{
  4. @H_403_19@ObjectMappermapper=new@H_403_19@ObjectMapper();
  5. @H_403_19@//把相同的对象放入List中@H_403_19@
  6. @H_403_19@List<User>list=new@H_403_19@ArrayList<User>();
  7. @H_403_19@Useru1,u2,u3;
  8. @H_403_19@list.add(u1);
  9. @H_403_19@list.add(u2);
  10. @H_403_19@list.add(u3);
  11. @H_403_19@response.setContentType("application/json"@H_403_19@);
  12. @H_403_19@mapper.writeValue(response.getOutputStream(),list);
  13. @H_403_19@}


第四种方式(ajax方法,带参数):

[javascript] view plain copy print ?
  1. @H_403_19@@H_403_19@$.ajax({
  2. @H_403_19@url:"ShowAdvertise"@H_403_19@,
  3. @H_403_19@type:'POST'@H_403_19@,
  4. @H_403_19@data:{time:time},
  5. @H_403_19@success:function@H_403_19@(data){
  6. @H_403_19@alert(data);
  7. @H_403_19@},
  8. @H_403_19@});

参考文献:

jQuery ajax - ajax() 方法

猜你在找的Ajax相关文章