原生AJAX实现登录功能

原生AJAX实现登录功能_第1张图片

function Interface() {
     


    var xmlhttp;
    if (window.XMLHttpRequest) {
      //IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
      // IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }


    //上面的http请求对象的生成做了一个浏览器兼容性处理
    var username = document.getElementById('user').value; //获取html表单中username输入域对象的值,既账号
    var password = document.getElementById('password').value; //获取html表单中pwd输入域对象的值,既密码 

    xmlhttp.onreadystatechange = function() {
     
        //当接受到响应时回调该方法
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
     
         
            var text = xmlhttp.responseText; //使用接口返回内容,响应内容
            var resultJson = eval("(" + text + ")"); //把响应内容对象转成javascript对象
            console.log(resultJson);
            var msg = resultJson.msg; //获取json中的result键对应的值
            var code = resultJson.code; //获取json中的code键对应的值
            if (msg !== "操作成功" && code !== 200) {
      //登录失败
                window.alert("登录失败!");
            } else {
     
                window.alert("登录成功!");
            } //登录成功        
        }
    }

    var data = {
      "username": username, "password": password }
    
    xmlhttp.open("POST", "http://192.168.137.127:1000/admin/login", true); //以POST方式请求该接口
    xmlhttp.setRequestHeader("Content-type", "application/json"); //添加Content-type
    xmlhttp.send(JSON.stringify(data));
}

你可能感兴趣的:(JavaScript,javascript)