ajax
麦超
这个作者很懒,什么都没留下…
展开
-
Ajax提交post请求
前言:博主之前有篇文章是快速入门Ajax,主要是利用Ajax做简单的get请求,今天给大家分享一篇利用Ajax提交post请求,以及使用post时需要注意的地方,还是以案例的方式告诉大家。案例: 注册表单文件结构图: 06-ajax-reg.html文件: 页面中主要有一个表单,使用了onsubmit事件,在onsubmit事件中首先获取准备post的内容,然后创建XMLHttpRequest原创 2016-10-10 19:33:11 · 8539 阅读 · 0 评论 -
Ajax快速入门
Ajax原理:页面不刷新的情况下,利用XMLHttpRequest对象发送HTTP请求,然后根据返回的内容进行相应的业务逻辑使用Ajax的步骤: (1)创建XMLHttpRequest对象 (2)发送http请求 (3)根据服务器返回的内容进行相应的操作一步一步来说哈!1、创建XMLHttpRequest对象 先看看w3c给出的信息 也就是说,如果要使用XMLHttpRequest对象原创 2016-10-07 13:21:12 · 367 阅读 · 0 评论 -
不使用XMLHttpRequest对象实现Ajax效果
前言: 我以前接触Ajax的时候,只是用Jquery的api来实现Ajax效果,对其并没有细细研究,最近在学习Ajax的原理,会不定时的发布关于Ajax的文章,希望大家关注!Ajax原理: 在页面不刷新的情况下,利用XMLHttpRequest发送HTTP请求。主题: 但是不依靠XMLHttpRequest对象,也是可以实现Ajax效果的,我们可以用Js实现对后台服务器的请求,同时不带来页面的原创 2016-10-06 18:07:30 · 1692 阅读 · 3 评论 -
使用反向Ajax技术做在线客服系统
反向Ajax技术,又称为服务器推技术,server push等。一般用于“在线客服”、“消息推送”、“即时通信”等功能中,比如新浪微博的私信功能,就是客户端不断的请求服务器并创建连接,去查看服务器有没有返回的信息,建立连接比较浪费服务器资源,下面我将根据客户端创建连接的不同性来介绍一下实现反向Ajax的三种思路。三种思路:1、间隔固定时间创建连接 这种方式就是按照固定时间不断的去请求服务器,当创建原创 2016-10-15 11:52:15 · 5905 阅读 · 3 评论 -
大文件切割上传带进度条
项目结构图: 14-slice-upload-fix.html文件:<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>大文件切割上传带进度条</title> <link rel="style原创 2016-10-14 12:45:16 · 1675 阅读 · 0 评论 -
大文件切割上传
大家都知道php上传文件有限制,如果没有修改过php.ini文件的话,默认的上传大小限制为2M,那么该如何上传大文件了,比如说上传一个1G多的大文件,可以使用大文件切割上传的方式来解决。何为大文件切割上传? 原理:利用HTML5的新特性,将文件内容切割成分段的二进制信息,然后每次向服务器上传一段,而服务器,只需要把我们每次上传的二进制信息整合存储到一个文件中,那么最后这个文件就是所上传的文件。由于原创 2016-10-14 08:58:52 · 9277 阅读 · 4 评论 -
带进度条的Ajax文件上传
之前分享了一篇关于使用FileApi实现Ajax上传文件 的文章,里面的Ajax文件上传是不带进度条的,今天分享一篇关于带进度条的Ajax文件上传文章。效果图: 项目结构图: 12-progress-upload.html文件: 页面中主要有一个上传文件控件,有文件被选择时响应selfile()方法,接着利用js读取上传文件、创建FormData对象和xhr对象,利用xhr2的新标准,写一个监原创 2016-10-13 14:38:58 · 2207 阅读 · 2 评论 -
使用FileApi实现Ajax上传文件
FileApi是HTML5的一个新特性,有了这个新特性,js就可以读取本地的文件了,然后实现真正的Ajax上传文件了,而不是iframe方法,下面会介绍api的使用,以及实现Ajax上传文件:FileApi使用定义上传控件:<input type="file" name="pic" onchange="selfile();" />当上传文件后,就会触发selfile()函数,selfile()代码:原创 2016-10-12 21:38:59 · 1252 阅读 · 0 评论 -
使用FormData对象提交表单
这是HTML5中新增的一个Api,他能以表单对象作为参数,自动的把表单的数据打包,当ajax发送数据时,发送这个FormData对象,以达到发送表单数据的目的。创建: 参数是一个form节点对象var fm = document.getElementById('formid');var fd = new FormData(fm);优点: (1)在以往的ajax做post请求时,当提交的数据比较原创 2016-10-12 19:36:12 · 8147 阅读 · 0 评论 -
iframe模拟Ajax上传文件
在xmlhttprequest level 1中,Ajax是不能够上传文件的,因为js不能操作本地文件,但是市场上有一些Ajax异步上传文件的插件,是怎么完成的呢?答案:可以使用iframe模拟Ajax上传文件。接下来博主将使用iframe来模拟Ajax来上传文件。首先看一下效果图: 文件结构图: 09-iframe-upload.html文件: 页面中有一个表单,表单中有一个上传文件按钮和提原创 2016-10-11 20:45:19 · 1219 阅读 · 0 评论 -
jsonp跨域请求
Ajax是不能跨域的,但是利用jsonp是可以实现跨域的,博主今天记录一篇jsonp跨域的实例。jsonp简介: JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通,而 HTML 的<scrip原创 2016-10-11 16:06:07 · 524 阅读 · 0 评论 -
Ajax返回值类型
Ajax返回值类型主要有XML类型和文本类型,其中文本类型又可以分为HTML、json类型等。1、返回值之XML类型 如果服务器的响应头中Content-type的内容为text/xml时,此时XMLHttpRequest对象的responseXML属性才能使用。2、返回值之文本类型 文本类型主要分为Html类型和json类型。 (1)Html类型 使用场景:一般返回需要重复复杂的操作。比如原创 2016-10-10 22:07:06 · 6529 阅读 · 0 评论 -
XMLHttpRequest对象详解
前言: 这篇文章给大家好好解析一下XMLHttpRequest对象的属性和方法,首先给大家看一图,下图是使用Telnet客户端请求某个文件的图片,其中包括了请求信息和响应信息,我们主要来看看响应信息,因为XMLHttpRequest对象不仅是用来发送HTTP请求的,而且还包括该http请求所包含的响应信息。Telnet客户端请求图: 1、常用属性: (1)status:服务器返回的状态码,通常原创 2016-10-07 17:36:10 · 618 阅读 · 0 评论