文档章节

Ajax状态码

xpttxsok
 xpttxsok
发布于 2016/04/13 11:15
字数 482
阅读 11
收藏 0
<form action="#" method="post">    
    <input type="text" name="username" id="username"/>
    <input type="password" name="password" id="password"/>
    <input type="button" onclick="loginAjax()" value="ajax登陆"/>
</form>



<script type="text/javascript">
    /*
        
        XMLHttpRequest i8+ 你口中所说的ajax
        它是构建HTTP请求的javascript对象,在早期它是ActiveX对象形式存在,
        服务器端和客户端数据传递过程异步的问题,早期数据的传递一个字符串一个xml
        实际上,ajax就是在javascript和xml之间建立一种异步传输的方式

        xml:为什么出现xml文档格式:
        一种有格式方便进行管理和解析

        它只不过是另外一种Http请求而已,它和form表单原理是一样,只不过不会刷新页面进行一种异步的交互
    */

    function loginAjax(){
        var username = document.getElementById("username").value;
        var password = document.getElementById("password").value;
        var params = "username="+username+"&password="+password;
        //创建一个(ajax)xhr对象
        var xhr = new XMLHttpRequest();
        //true代码的是异步请求,执行成功和失败回调函数
        //请求的状态, readyState 
        //0:未初始化状态
        //1:载入请求的状态
        //2:载入完成状态
        //3:请求交互状态
        //4:请求完成状态


        //可以捕获服务器错误,知识点:status
        //500 服务器连接失败 ---服务器关闭
        //404 代表页面找到
        //400 Bad Request请求语法。url写错了,请求地址有问题
        //405 请求方式有问题 springmvc  methpd=RequestMethod.POST
        //200 代表交互成功,正确请求和响应
        xhr.onreadystatechange = function(){
            //ajax载入完成和服务器没错误
            if(this.readyState == 4 && this.status ==200){
                alert(this.responseText)
            }
        };
        //请求方式:post/get
        //get请求的方式如下:
        //xhr.open("get","http://localhost/keke_ajaxtest/xiaojie.jsp"+params,true);
        //xhr.send();
        //post请求的方式如下:
        xhr.open("post","http://localhost/keke_ajaxtest/xiaojie.jsp",true);
        xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
        xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded;"); 
        //发送数据,如果请求方式是post话send一定要设置参数
        xhr.send(params);//发送
    };

    /*
    <form action="http://localhost/keke_ajaxtest/xiaojie.jsp" method="post">    
        <input type="text" name="username"/>
        <input type="text" name="password"/>
        <input type="submit" value="form登陆"/>
    </form>*/
    
</script>


© 著作权归作者所有

xpttxsok
粉丝 7
博文 182
码字总数 107935
作品 0
徐汇
程序员
私信 提问
ajax异步请求,session超时处理

在web开发中,通常会有session超时处理,对于普通的http请求比较容易处理,而对于ajax异步请求,可能就需要特殊处理了 / 服务器端:拦截器或过滤器处理:/ // 异步请求session超时的处理if ...

厚客
2014/03/27
7.7K
0
Ajax 高级教程之 AJAX状态值与状态码

1- AJAX状态值与状态码区别 AJAX状态值是指,运行AJAX所经历过的几种状态,无论访问是否成功都将响应的步骤,可以理解成为AJAX运行步骤。如:正在发送,正在响应等,由AJAX对象与服务器交互时...

残风vs逝梦
2014/07/25
336
0
JavaScript实现Ajax请求简单示例

很久之前用过JavaScript写Ajax请求,后来一直用JQuery,今天突然想起来,于是参考网上的资料重新写了一遍,在此整理并记录下来,以备以后查看使用,也希望对初学者有所帮助!示例代码如下: ...

IceRainYWC
2013/10/10
9.9K
1
AJAX从入门到放弃

AJAX简单介绍 AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML),是一种创建交互式网页应用的网页开发技术;AJAX = 异步 Javascript和XML;通过在后台与服务器进行少量数据交换,...

许渺
2017/11/16
0
0
Ajax详解(手写jq和axios部分实现)

含义: 一、Ajax原生JS操作 二、关于HTTP请求方式: GET: 从服务器获取数据 POST: 向服务器推送数据 DELETE: 删除服务器端的某些内容 PUT: 向 服务器存放一些内容 HEAD: 只想获取服务器返回的...

神三元
06/22
0
0

没有更多内容

加载失败,请刷新页面

加载更多

OpenStack 简介和几种安装方式总结

OpenStack :是一个由NASA和Rackspace合作研发并发起的,以Apache许可证授权的自由软件和开放源代码项目。项目目标是提供实施简单、可大规模扩展、丰富、标准统一的云计算管理平台。OpenSta...

小海bug
昨天
6
0
DDD(五)

1、引言 之前学习了解了DDD中实体这一概念,那么接下来需要了解的就是值对象、唯一标识。值对象,值就是数字1、2、3,字符串“1”,“2”,“3”,值时对象的特征,对象是一个事物的具体描述...

MrYuZixian
昨天
6
0
数据库中间件MyCat

什么是MyCat? 查看官网的介绍是这样说的 一个彻底开源的,面向企业应用开发的大数据库集群 支持事务、ACID、可以替代MySQL的加强版数据库 一个可以视为MySQL集群的企业级数据库,用来替代昂贵...

沉浮_
昨天
6
0
解决Mac下VSCode打开zsh乱码

1.乱码问题 iTerm2终端使用Zsh,并且配置Zsh主题,该主题主题需要安装字体来支持箭头效果,在iTerm2中设置这个字体,但是VSCode里这个箭头还是显示乱码。 iTerm2展示如下: VSCode展示如下: 2...

HelloDeveloper
昨天
8
0
常用物流快递单号查询接口种类及对接方法

目前快递查询接口有两种方式可以对接,一是和顺丰、圆通、中通、天天、韵达、德邦这些快递公司一一对接接口,二是和快递鸟这样第三方集成接口一次性对接多家常用快递。第一种耗费时间长,但是...

程序的小猿
昨天
10
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部