首先创建XMLHttpRequest对象，利用此对象发送请求

主页面

<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>使用Ajax</title>

<script type="text/javascript">

function vote(){

    //XmlHttpRequest对象，一个专门的HTTP请求工具

    /*

    实现Ajax要考虑的内容：

    1，用什么请求方式

    2，请求哪个资源(url)

    3，同步还是异步

    */

    var xhr=new XMLHttpRequest();

    // document.write(xhr);

    // alert(xhr);

    // console.log(xhr);//在IE10以下版本console未定义

    //单向请求

    xhr.open('GET','./01.php',true);//打开连接

    //请求方法，请求地址，同步还是异步

    xhr.send(null);//发送请求，不发送数据

    alert(xhr.responseText);

    alert("hello");

}

</script>

</head>

<body>

    <form action="" method="post">

        <p>用户名:<input type="text" name="username"/></p>

        <p>密码:<input type="password" name="pwd"/></p>

        <p><input type="submit" value="注册" onclick="vote()"/></p>

    </form>

</body>

</html>

返回值为01.php中echo的内容

同步与异步的理解

等待send()执行完毕之后，再执行后面的语句为同步  false

不等带send()的是否执行，直接执行后面的语句为异步 true


xhr对象在请求和响应过程中，状态会不断变化，1-4逐步变化，到4时，表示成功

可以绑定一个函数，来监听状态的改变，最终实现接收最后响应信息

添加以下代码，用异步传输

//状态变化的回调函数

    xhr.onreadystatechange=function(){

        if(xhr.readyState==4){

            alert("请求成功了");

            alert(xhr.responseText);//弹出返回信息,responseText是属性不是方法

        }

    }

ajax发送请求的更多相关文章

  1. ajax发送请求跨域 - uri java代理

    问题:ajax发送请求出现cors跨域 解决办法:可以通过java代理的方式,后台发送请求 1.get请求 public void proxyGet(String url) { try { URL r ...

  2. Ajax发送请求等待时弹出模态框等待提示

    主要的代码分为两块,一个是CSS定义模态框,另一个是在Ajax中弹出模态框. 查看菜鸟教程中的模态框教程demo,http://www.runoob.com/try/try.php?filename= ...

  3. Ajax - 发送请求原理

    1,什么是ajax? Asynchronous JavaScript and XML(当然现在xml已经由json代替): 主要是用于前后台的交互(表单提交已经被废弃): 使用场景:前台获取数据.表单 ...

  4. ajax对象。同步与异步及ajax发送请求

    ajax对象的属性.方法 属性 readyState: Ajax状态码 * 0:表示对象已建立,但未初始化,只是 new 成功获取了对象,但是未调用open方法 1:表示对象已初始化,但未发送,调用了 ...

  5. Django——Ajax发送请求验证用户名是否被注册

    场景: 用户注册的时候,输入用户名之后,Ajax发送请求到后端,后端验证该用户名是否已经被注册,然后返回到注册页面提示用户. 1.模型: from django.db import models cl ...

  6. 原生Ajax发送请求

    ajax  get&post 1.使用get发送请求,会有请求缓存 1)什么叫请求缓存,请求信息相同浏览器不会再向服务器发送请求,导致访问服务器失败. 2)解决:将随机数添加到请求路径后面参数 ...

  7. angularjs --- ngResource 类似于 ajax发送请求。

    <!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="C ...

  8. Ajax发送请求的四个步骤

    1.创建XMLHttpRequest let xhr=new XMLHttpRequest; 2.连接服务器 xhr.open("get","goods.json&quo ...

  9. flask ajax发送请求返回400

    在flaskWTF使用csrf保护后,一般提交form表单都需要一个隐藏的csrf 这样可以成功提交,但是使用ajax提交时就不能成功提交,会返回400错误,服务器无法理解请求,这样就需要新的方法解决 ...

随机推荐

  1. uvalive 3890 Most Distant Point from the Sea

    题意:求一个凸多边形中一点到边的最大距离. 思路:转换成在多边形内部,到每边距离为d的直线所围成的内多边形是否存在.也就是,二分距离+半平面交. #include<cstdio> #inc ...

  2. Linux 下文件名乱码（无效的编码）的解决办法

    文件是在WIndows 下创建的,Windows 的文件名中文编码默认为GBK,而Linux中默认文件名编码为UTF8,由于编码 不一致所以导致了文件名乱码的问题,解决这个问题需要对文件名进行转码. ...

  3. Hadoop MapReduce概念学习系列之mr程序详谈（二十三）

    这个暂时,没写好. K1,v1 这是增强的for循环. for(Sting w : words) { } 迭代器里,前面,放的是什么类型,后面,迭代的是谁.

  4. [iOS基础控件 - 4.6] iOS开发中的长度单位

    对于开发中设置的位置.尺寸单位 系统会根据屏幕的性质转换为像素单位 由于视网膜屏在同样尺寸下分辨率是非视网膜屏的两倍,所以 非视网膜屏:1个单位 = 1像素 视网膜屏:1个单位 = 2像素   应对非 ...

  5. Open War I: 怪物繁殖，行走仿真，瞄准射击...

    See below demo: Share the source codes with your guys. >>>download this "hacking meat& ...

  6. Dom深入浅出

    Dom1级提供了一个Node接口,该接口将由Dom中所有节点类型(包括元素节点.文本节点.属性节点等12种)实现,而js是作为Node类型来实现的,js中的所有节点类型的继承自Node类型, 所以它们 ...

  7. 图形用户界面（graphical user interface）

    1 java中提供的类库 1.1 定义 AWT(abstract windows toolkit)抽象窗口工具包:提供了与本地图形界面进行交互的接口,AWT中提供的图形函数与操作系统的图形函数有着对应 ...

  8. Protobuf-net学习笔记

    对于Socket应用来说,如何序列化和反序列化消息一直是比较头痛的问题,C#提供了自动序列化的功能(类似AS3中的AMF),但是唯一的缺点就是前后端都必须是C#实现,如果前后端语言不一致该怎么办? G ...

  9. HALCON 简介

    HALCON   windowssolarisgccdelphilinux图像处理 ·满足您各类机器视觉应用需求的完善的开发库 ·包含匹配,识别,定位及1D,2D,3D测量等多种高级算法 ·强大,易用 ...

  10. Judge

    1. 循环list中的所有元素然后删除重复 public   static   List  removeDuplicate(List list)  { for  ( int  i  =   0 ; i ...