原生AJAX如何异步提交数据?
AJAX概述
AJAX:Asynchronous Javascript And XML,异步的JS和XML。2001,Google为了改进搜索的用户体验,提出了GoogleSugguest效果,正式提出了AJAX的概念。
目标:在无刷新无提交的情况下,实现页面内容的局部更新——数据来自于服务器。
常见应用:实时数据获取(如股票走势图)、搜索建议、聊天室、SPA
AJAX应用依赖于浏览器底层提供的核心对象:
XMLHttpRequest:用于向Web服务器发起异步请求,并接收响应消息。
使用XHR发起异步请求步骤:
(1)创建XHR对象 —— 每个XHR只能发一个请求
varxhr = new XMLHttpRequest();
(2)绑定监听函数,处理XHR的每一次状态改变
xhr.onreadystatechange = function(){ }
(3)打开到Web服务器的连接
xhr.open('GET','9.php', true);
(4)发送请求消息主体
xhr.send(null);
若第(3)步中是POST方法,则要设置请求头格式,即
xhr.open('POST', 'x.php', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); //修改请求消息头部
xhr.send('k1=v1&k2=v2&k3=v3');
以上是原生AJAX的基本步骤,练习内容为:仿google的搜索建议。链接地址为:搜索建议
原生AJAX如何异步提交数据?的更多相关文章
- jQuery选取所有复选框被选中的值并用Ajax异步提交数据
昨天和朋友做一个后台管理系统项目的时候涉及到复选框批量操作,如果用submit表单提交挺方便的,但是要实现用jQuery结合Ajax异步提交数据就有点麻烦了,因为我之前做过的项目中基本上没用Ajax来 ...
- JQuery中使用FormData异步提交数据和提交文件
web中数据提交事件是常常发生的,但是大多数情况下我们不希望使用html中的form表单提交,因为form表单提交会中断当前浏览器的操作并且会调到另一个地址(即使这个地址是当前页面),并且会重复加载一 ...
- ASP模拟POST请求异步提交数据的方法
这篇文章主要介绍了ASP模拟POST请求异步提交数据的方法,本文使用MSXML2.SERVERXMLHTTP.3.0实现POST请求,需要的朋友可以参考下 有时需要获取远程网站的某些信息,而服务器又限 ...
- Ajax.BeginForm的异步提交数据 简介
Html.BeginForm与Ajax.BeginForm都是MVC架构中的表单元素,它们从字面上可以看到区别,即Html.BeginForm是普通的表单提交,而Ajax.BeginForm是支持异步 ...
- 表单(同步提交)和AJAX(异步提交)示范
表单提交(同步提交) HTML文件: PHP文件: 这样就能接收到HTML里输入的内容,注意: FORM表头method为POST,PHP文件获取的方法就是$_POST,method为GET,PHP的 ...
- 通过ajax给后台提交数据时,radio性别数据的获取
通过ajax向后台异步发送数据,经常我们会遇到个人信息额提交,一般我们采用FormData来装数据.在装性别值得时候,我们会有两个radio框,获取radio值得方法如下: 一般情况下,一个radio ...
- JQuery 异步提交数据
类别添加 名称:   正在发送数据请求… <% dim strValue blnLogin = false; strValue = request.Form("t ...
- MVC—实现ajax+mvc异步获取数据
之前写过ajax和一般处理程序的结合实现前后台的数据交换的博客,如今做系统用到了MVC,同一时候也用到了异步获取数据. ajax+一般处理程序与MVC+ajax原理是一样的在"URL&quo ...
- 使用bean接收ajax表单提交数据包含文件上传
这几天写带图片上传的表单提交,一个配置小程序活动弹出框样式的功能,记录一下一些需要注意的地方 首先是 前端 JSP 文件的表单 <form class="search-wrapper& ...
随机推荐
- C++11 静态断言(static_assert)
简介 C++0x中引入了static_assert这个关键字,用来做编译期间的断言,因此叫做静态断言. 其语法很简单:static_assert(常量表达式,提示字符串). 如果第一个参数常量表达 ...
- android 开发随笔 - 开发环境搭建
1.1 问题: 'tools.jar' seems to be not in Android Studio classpath. Please ensure JAVA_HOME points to J ...
- My way to Python - Day012 - 消息中间件
消息中间件介绍 消息中间件的概念 消息中间件是在消息传输过程中保存消息的容器.消息中间件在将消息从它的源中继到它的目标时充当中间人的作用.队列的主要作用是提供路由并保证消息的传递:如果发生消息接收者不 ...
- 数据库分库分表(sharding)系列(三) 关于使用框架还是自主开发以及sharding实现层面的考量
当团队对系统业务和数据库进行了细致的梳理,确定了切分方案后,接下来的问题就是如何去实现切分方案了,目前在sharding方面有不少的开源框架和产品可供参考,同时很多团队也会选择自主开发实现,而不管是选 ...
- uva11292贪心基础题目
C - 贪心 基础 Crawling in process... Crawling failed Time Limit:1000MS Memory Limit:65536KB 64bi ...
- 引用 exit、return、_exit、_Exit这几个函数的区别
引用 exit.return._exit._Exit这几个函数的区别 一.exit函数和return函数的主要区别是: exit用于在程序运行的过程中随时结束程序,其参数是返回给OS的.也可以这么讲: ...
- ifstream中文路径问题分析
最近维护一个项目,遇到了ifstream在中文路径下打开文件失败的bug,我搜索了一下,最后整理成下文以后日后查阅. 一.问题重现 vs2008下创建一个简单win32工程. 使用ANSI编码方式:项 ...
- 虚拟机安装centos
linux安装 鉴于国内大多数服务器都使用的redhat系列作为操作系统,centos又是redhat的免费版本,所以可以学习一下.因为另一台古董电脑已经装了linuxmint,虽然也可以安装虚拟机, ...
- jquery.BannerRotator.js
项目地址:https://github.com/snipertulip/BannerRotator 演示地址:http://snipertulip.github.io/BannerRotator/de ...
- python爬虫下载youtube单个视频
__author__ = 'Sentinel'import requestsimport reimport jsonimport sysimport shutilimport urlparse &qu ...