【关于AJAX的传输，和调用后台的接口问题 _解析 _Ajax 】

关于AJAX的传输，和调用后台的接口问题

我也踩过这个坑( 1 )

已统计您的踩坑,无需重复点击

回答(1)

解析 Ajax

详细描述

截图

代码

// 获取input的数值
var ID = document.getElementById('ID');
// 第二个input的数值
var password = document.getElementsByClassName('password')[0];
var show = document.getElementById('show');
// 声明一个请求
var xhr;
// 点击事件，点击的时候获取到输入框输入的数值
function NEWbutton() {
    console.log(ID.value);
    console.log(password.value);
    if (ID.value == '') {
        show.innerHTML = '请输入账号'
        return false;
    } else if (password.value == '') {
        show.innerHTML = '请输入密码'
        return false;
    } else {
        // 请求参数
        var data = 'name=' + ID.value + '&pwd=' + password.value;
        var lin = '/carrots-admin-ajax/a/login';
        xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
            // 通信成功时，状态值为4
            if (xhr.readyState === 4 && xhr.status === 200) {
                 var xuan = JSON.parse(xhr.responseText);
                console.log(xuan)
                if (xuan.code == 0) {
                    location.href = 'http://dev.admin.carrots.ptteng.com/#/dashboard'
                } else {
                    show.innerHTML = xuan.message;
                }
            } 
        }
    };
    // 发送了请求，使用POST的形式进行发送
    xhr.open('POST', lin, true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.send(data);
    return false;
}

编辑于2024-05-01

时间排序

热门排序

[散修弟子]JS-1950
0

应该是作用域问题，最后面的三行代码（open、setRequestHeader、send）应放在else后面的花括号内，才能获取到相应的变量，正常运行

查看全部>

编辑于2021-04-30

去第页