码迷,mamicode.com
首页 > Web开发 > 详细

js-Ajax-get和post请求

时间:2018-05-04 21:25:45      阅读:191      评论:0      收藏:0      [点我收藏+]

标签:js   Ajax   get   

1:get请求方式:

// 1:创建XMLHttpRequest对象
var xhr;
if (window.XMLHttpRequest) { // 其他类型的浏览器
    xhr = new XMLHttpRequest();
} else { // ie浏览器
    xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
// 2:配置请求信息
xhr.open('get', 'ProcessShow.ashx', true);
// 3:发送请求
xhr.send();
// 4:监听状态 注册onreadystatechange事件
xhr.onreadystatechange = function() {
    // 5:判断请求和相应是否成功
    if (xhr.readyState == 4 && xhr.status == 200) {
        // 6:获取数据 并做相应的处理
        var data = xhr.responseText; 
    }
}

技术分享图片

这是一个完整的Ajax的get请求步骤。

如果get请求需要传递数据,就这样写:

xhr.open('get', 'ProcessShow.ashx?id=1&name=rose', true);

2:post请求方式:

// 1:创建XMLHttpRequest对象
var xhr;
if (window.XMLHttpRequest) { // 其他类型的浏览器
    xhr = new XMLHttpRequest();
} else { // ie浏览器
    xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
// 2:配置请求信息
xhr.open('post', 'ProcessShow.ashx', true);
// 3:发送请求
xhr.send();  // 为空表示没有任何的参数
// 4:监听状态 注册onreadystatechange事件
xhr.onreadystatechange = function() {
    // 5:判断请求和相应是否成功
    if (xhr.readyState == 4 && xhr.status == 200) {
        // 6:获取数据 并做相应的处理
        var data = xhr.responseText; 
    }
}

技术分享图片

js-Ajax-get和post请求

标签:js   Ajax   get   

原文地址:http://blog.51cto.com/11871779/2112874

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!