var username = document.getElementById('username').value;
            var password = document.getElementById('password').value;

            // 第一步:创建对象
            var xhr = null;
            if(window.XMLHttpRequest){
                xhr = new XMLHttpRequest();
            }else{
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
            //初始化
            var url = './check.php?username='+username+"&password="+password;
            xhr.open('post',url,false);
            //这段代码在xhr.send();执行完之后才能执行
            xhr.onreadystatechange = function(){
                if(xhr.readyState == 4){
                    if(xhr.status == 200){
                        alert(1);
                        var data = xhr.responseText;
                        if(data == 1){
                            document.getElementById('showInfo').innerHTML = '用户名或者密码错误';
                        }else if(data == 2){
                            document.getElementById('showInfo').innerHTML = '登录成功';
                        }
                    }
                };
            }

            xhr.send(null);

原生JS Ajax 请求的更多相关文章

  1. 原生js ajax请求

    什么是ajax AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新. 这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新, ...

  2. 原生js ajax与jquery ajax的区别

    原生js ajax的调用: ajax({ type : "get", url : "02_ajax_get.txt", data : { "userN ...

  3. js ajax请求传token

    js  ajax请求传token 方法一: headers: { Authorization: "BasicAuth " + token } 方法二: beforeSend: fu ...

  4. 原生 JS Ajax,GET和POST 请求实例代码

    javascript/js的ajax的GET请求代码如下所示: <script type="text/javascript"> /* 创建 XMLHttpRequest ...

  5. 使用XMLHttpRequest对象完成原生的AJAX请求

    1.大家眼中的Ajax 说到Ajax,只要有过前端开发经验的童鞋一定都不陌生,大都知道它就是一种与后端之间的通信技术,通过这个神奇的家伙,我们不用像传统表单那样填完信息一点提交就呼啦呼啦跳转了.Aja ...

  6. 当跨域时,js ajax 请求出现options请求

    上面有文章说过http的options. 查了很久.试了很多版本的jQuery,下面这段代码在同事的机子上测试是没有问题的.正常 的请求, 一在我机子上面就会出现option,网上说先向服务器预检等. ...

  7. 原生的ajax请求

    原生ajax请求的步骤: get 请求: 1,创建一个xhr变量 var xhr=new XMhttpRequest(); 2,设置请求方式和请求地址 xhr.open('url','http//19 ...

  8. [JS] Ajax请求会话过期处理

    对于页面来说,处理session过期比较简单,一般只需在过滤器里面判断session用户是否存在,不存在则跳转页面到登陆页即可. 对于Ajax请求来说,这个办法则无效,只能获取到登录页的html代码. ...

  9. 新浪博客:html+css+原生JS+Ajax初级+mySql数据库——源码

    **************************************************************************************************** ...

随机推荐

  1. zookeeper的安装与部署-集群

    1.Zookeeper的下载与解压     通过后面的链接下载Zookeeper:    Zookeeper下载在此我们下载zookeeper-3.4.5下载后解压至安装目录下,本文我们解压到目录:/ ...

  2. 简单易用的.NET免费开源RabbitMQ操作组件EasyNetQ解析

    对于目前大多的.NET项目,其实使用的技术栈都是差不多,估计现在很少用控件开发项目的了,毕竟一大堆问题.对.NET的项目,目前比较适合的架构ASP.NET MVC,ASP.NET WebAPI,ORM ...

  3. 转接口IC ADV7280/ADV7280-M:CVBS转MIPI转接口芯片 10位、4倍过采样标清电视视频解码器,支持去隔行

    概述ADV7280/ADV7280-M是功能丰富的单芯片.多格式视频解码器.ADV7280/ADV7280-M可自动检测标准模拟基带视频信号,兼容复合.S视频和分量视频形式的NTSC.PAL和SECA ...

  4. Entity Framework快速入门--IQueryable与IEnumberable的区别

    IEnumerable接口 公开枚举器,该枚举器支持在指定类型的集合上进行简单迭代.也就是说:实现了此接口的object,就可以直接使用foreach遍历此object: IQueryable 接口 ...

  5. Excel import

    Case Study: Reading cell content from excel template for COM variant type VT_R4 or VT_R8 is always l ...

  6. 图解CSS选择器之nth家族

    1 nth-last-of-type  顾名思义从最后开始的元素开始选取可接受 数字 关键词 公式  比如4n+0就是每隔四个 odd even关键词表示奇偶数 .classify-item:nth- ...

  7. 使用react native制作的一款网络音乐播放器

    使用react native制作的一款网络音乐播放器 基于第三方库 react-native-video设计"react-native-video": "^1.0.0&q ...

  8. PHPCMS笔记第二弹

    熟练地使用PHPCMS可以插入模板,将静态站转变为动态站也更加方便,多加练习还是有好处的 将index.html的头和尾拆分出来,分别放在header.html和footer.html文件夹中,这三个 ...

  9. Webpack模块加载器

    一.介绍 Webpack是德国开发者 Tobias Koppers 开发的模块加载器,它能把所有的资源文件(JS.JSX.CSS.CoffeeScript.Less.Sass.Image等)都作为模块 ...

  10. JS+html--实现图片轮播

    大家肯定见过某些网站一个炫酷的页面,就是图片轮播,也就是我们常说的幻灯片播放.对于初学者来说,可能会有点头疼,没关系,小李在这给大家献上自己刚刚写好的关于图片轮播的代码. 以下功能的实现用了jQuer ...