1、ajax-get请求demo

 <script>
document.getElementById("buttonname").onclik=function(){
//发送AJAX查询请求
var request=new XMLHttpRequest();
request.open("GET","xxxx.jsp?name="+document.getElementById("name").value + "&old="+document.getElementById("old").value);
  request.send();
  request.onreadystatechange = funtion(){
    if(request.readState===4){
      if(request.status===200){
        document.getElementById("div").innetHTML= request.responseText;
      }else{
        alert("请求错误"+request.status);
      }
    }
  } }
</script>

2、ajax-post请求demo

  1 <script>
2 document.getElementById("buttonname").onclik=function(){
3 //发送AJAX查询请求
4 var request=new XMLHttpRequest();
5 request.open("POST","xxxx.jsp");
      var data="name="+document.getElementById("name").value
           +"&old="+document.getElementById("old").value;
      requeat.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
6   request.send(data);
7   request.onreadystatechange = funtion(){
8     if(request.readState===4){
9       if(request.status===200){
10         document.getElementById("div").innetHTML= request.responseText;
11       }else{
12         alert("请求错误"+request.status);
13       }
14     }
15   }
16
17 }
18 </script>

3、ajax请求-返回JSON格式

{

  "success":"true",

  "msg":"text"

}

 1 <script>
2 document.getElementById("buttonname").onclik=function(){
3 //发送AJAX查询请求
4 var request=new XMLHttpRequest();
5 request.open("GET","xxxx.jsp?name="+document.getElementById("name").value + "&old="+document.getElementById("old").value);
6   request.send();
7   request.onreadystatechange = funtion(){
8     if(request.readState===4){
9       if(request.status===200){
          var data=JSON.parse(request.responseText);
          if(data.success){
              document.getElementById("div").innetHTML= data.msg;
            }else{
12             document.getElementById("div").innetHTML= data.msg;
 13           }
10       }else{
12         alert("请求错误"+data.msg);
13       }
15   }
16
17 }
18 </script>

4、jQuery实现ajax

  jQuery.ajax([settings])

    type:类型,post或get,默认为get

    url:发送请的地址

    data:是一个对象,连同请求发送到服务器的数据

    dataType:预期服务器返回的数据类型。如果不指定,jquery将自动根据HTTP包MIME信息来智能判断,一般我们采用json格式,可以设置为"json"

    success:是一个方法,请求成功后的回调函数。传入返回的数据,以及包含成功代码的字符串

    error:是一个方法,请求失败时调用此函数。传入XMLHttpRquest对象

  例子:

    $(document).ready(funtion(){

      $("#name").click(funtion(){

        $.ajax({

          type:"GET",

          url:"XXX.jsp?name="+$("#name").val(),

          dataType:"json",

          success:funtion(data){

            if(data.success){

              $("#name").html(data.msg);

            }esle{

              $("#name").html("发错了"+data.msg);

            }

          },

          error.funtion(jqXHR){

            alert("出错了"+jqXHR.status);

          }

         });

      });

    }

  )

jquery.ajax示例

 $(function(){
//请求参数
var list = {};
//
$.ajax({
//请求方式
type : "POST",
//请求的媒体类型
contentType: "application/json;charset=UTF-8",
//请求地址
url : "http://127.0.0.1/admin/list/",
//数据,json字符串
data : JSON.stringify(list),
//请求成功
success : function(result) {
console.log(result);
},
//请求失败,包含具体的错误信息
error : function(e){
console.log(e.status);
console.log(e.responseText);
}
});
});

//JSON.stringify 将对象转为字符串
  var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"};
  var myJSON = JSON.stringify(obj);
//JSON.parse 将字符串转化为对象
  var obj = JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }');

ajax发送GET和POST请求的更多相关文章

  1. 【转】AJAX发送 PUT和DELETE请求注意事项

    jax使用restful服务发送put 和 delete 请求时直接传参会出现问题 一,采用POST  + _method:delete/put  + filter 的方法ajax发送put 和 de ...

  2. AJAX发送 PUT和DELETE请求参数传递注意点,了解一下

    ajax发送put 和 delete 请求时,需要传递参数,如果参数在url地址栏上,则可以正常使用, 如果在 data:中需要传递参数,(浏览器会使用表单提交的方式进行提交) 则需要注意此时应作如下 ...

  3. 通过 Ajax 发送 PUT、DELETE 请求的两种实现方式

    一.普通请求方法发送 PUT 请求 1. 如果不用 ajax 发送 PUT,我们可以通过设置一个隐藏域设置 _method 的值,如下: <form action="/emps&quo ...

  4. Ajax发送GET和POST请求案例

    使用ajax实现菜单联动 通常情况下,GET请求用于从服务器上获取数据,POST请求用于向服务器发送数据. 需求:选择第一个下拉框的值,根据第一个下拉框的值显示第二个下拉框的值 首先使用GET方式. ...

  5. Ajax发送GET、POST请求和响应XML数据案例

    1.新建工程 新建一个java web工程,新建一个Servlet文件 AServlet.java,用于返回get和post请求. public class AServlet extends Http ...

  6. 原生Ajax发送get、post请求每一步

    说明 发送Ajax的请求的核心对象是XMLHttpRequest,因此我们需要了解该对象的相关属性和方法 方法(图一) 属性(图二) 第一步:创建 XMLHttpRequest对象,下面都简写为 xh ...

  7. Ajax发送异步请求(四步操作)

    1.第一步(得到XMLHttpRequest) *ajax其实只需要学习一个对象:XMLHttpRequest,如果掌握了它,就掌握了ajax!! *得到XMLHttpRequest >大多数浏 ...

  8. Ajax详解及其案例分析------如何获得Ajax对象,使用Ajax对象发送GET和POST请求,校验用户名,POST和GET请求时的乱码处理,实现级联的下拉列表

    本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...

  9. Ajax发送POST请求的心路历程

    好多年前就在项目中用ajax实现了页面部分数据的发送,当时用的是GET方法. 这次用POST方法实现同样的功能,竟然花费了不少的时间! ① 关于JQuery ajax的配置项说明 url : 请求的u ...

随机推荐

  1. Integer.parseInt(s)、Integer.valueOf(s)与new Integer()的异同

    我们在开发过程中,很多时候需要将String类型数据转换成Integer,而比较常用的方式就是--nteger.parseInt(s).Integer.valueOf(s)与new Integer() ...

  2. Docker on startup: “No activity detected on VM, aborting”

    windows下安装的docker,切换到linux,一直处于重启中,最后报No activity detected on VM, aborting错误 上网百度一下这个错误,基本上没人遇到过,最后在 ...

  3. C++泛型算法总结

    1 accumulate(b,e,T) 累和(基础和为T) 注意T的类型必须和序列中元素类型相同,如double序列后面的T就必须是0.0,如果是0就会把序列中的数当成int进行求和 2 count( ...

  4. 股票数据Scrapy爬虫

    功能描述: 技术路线:scrapy 目标:获取上交所和深交所所有股票的名称和交易信息 输出:保存到文件中 数据网站的确定 获取股票列表: 东方财富网:http://quote.eastmoney.co ...

  5. drf框架,restful接口规范,源码分析

    复习 """ 1.vue如果控制html 在html中设置挂载点.导入vue.js环境.创建Vue对象与挂载点绑定 2.vue是渐进式js框架 3.vue指令 {{ }} ...

  6. 【音乐欣赏】《JINGO JUNGLE》 - MYTH & ROID

    歌名:JINGO JUNGLE 作者:MYTH & ROID [00:19.82]Don’t go away 逃げ場はない [00:27.12]Oh why? You’re crying 嗤え ...

  7. Atcoder Beginner Contest152F(DFS+状压DP)

    二维状压写成一维状压,省略加上第i条边这一维 #define HAVE_STRUCT_TIMESPEC #include<bits/stdc++.h> using namespace st ...

  8. Linux shell cut 命令详解

    详细资料请参考:博客园骏马金龙 https://www.cnblogs.com/f-ck-need-u/p/7521357.html cut命令将行按指定的分隔符分割成多列,它的弱点在于不好处理多个分 ...

  9. blog主题——马路

    blog主题,存储一下 css /************************************************** 第一部分:所有的模板都使用的公共样式.公告样式是为了更好的向前 ...

  10. deepin-wine-qq无法加载图片解决方案

    最近在qq水群讨论学术的时候发现了一个奇怪的问题:无法加载图片. 具体点是,如果图片没有被其他设备接收,并且在缓存中,图片是可以加载的,反之不可. 这东西很烦人啊,于是我就去查项目issue:http ...