当前位置:首页 > 开发 > Web前端 > Jquery > 正文

用 jQuery.ajax 基于 XMLHttpRequest,FormData 的表单上传

发表于: 2013-01-06   作者:achun   来源:转载   浏览:
摘要:  XMLHttpRequest 已经推出很长时间了,W3C 对此引入了一些很好的特性,阮一峰有一篇很好的文章对此进行了汇总式的介绍 XMLHttpRequest Level 2 使用指南 。 在实际使用中排除那些落伍的浏览器,最简单的使用方法就是 用标准的 HTML 语法生成 FORM 表单 hander 表单的 submit 事件,用 FormData 生成 XMLHtt

 XMLHttpRequest 已经推出很长时间了,W3C 对此引入了一些很好的特性,阮一峰有一篇很好的文章对此进行了汇总式的介绍 XMLHttpRequest Level 2 使用指南

在实际使用中排除那些落伍的浏览器,最简单的使用方法就是

  • 用标准的 HTML 语法生成 FORM 表单
  • hander 表单的 submit 事件,用 FormData 生成 XMLHttpRequest 提交数据,进行提交, 向submit 返回 false
  • 处理 XMLHttpRequest 结果

这样就完成了ajax方式的表单提交。当然这是支持文件上传 的。如果我们使用 jQuery.ajax 代码大概就是这个样子

$('yourform').submit(function(){
    var formdata=new FormData(this);
    $.ajax({
        type:'POST',
        url:'/yourpath',
        data:formdata,
        /**
         *必须false才会自动加上正确的Content-Type
         */
        contentType:false,
        /**
         * 必须false才会避开jQuery对 formdata 的默认处理
         * XMLHttpRequest会对 formdata 进行正确的处理
         */
        processData:false
    }).then(function(){
        //doneCal
    },function(){
        //failCal
    });
    return false;
});

标准之下就是这么简单。

有很多时候是可以要求用户使用现代浏览器的。比如对于编辑,对应定制的企业用户。

 

 

用 jQuery.ajax 基于 XMLHttpRequest,FormData 的表单上传

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
FormData 对象,可以把form中所有表单元素的name与value组成一个queryString,提交到后台。在使用Aj
这段时间,一直练习在ASP.NET MVC程序中上传文件。静态,动态,单个或多文件上传。 在网上有看到网
废话不多说,直接讲解实现步骤 一、首先我们需定义支持WEB HTTP方法调用的WCF服务契约及实现服务契
基于Spring3 MVC实现基于form表单文件上传 一:杂项准备 环境搭建参考这里-http://blog.csdn.net/ji
<script type="text/javascript"> function creatXMLHttpRequest(){ var obj =null; if(windo
之前在“反向Ajax,第1部分:Comet介绍”(英文版)文章中学习了“基于 Multipart XMLHttpRequest
上篇博客,我们简单的介绍了js实现上传图片之前判断图片格式,同时实现预览。这篇博客,给大家介绍
上篇博客,我们简单的介绍了js实现上传图片之前判断图片格式,同时实现预览。这篇博客,给大家介绍
  早在公元2011年6月3日傍晚,人人网推出了一个很装B且完全无视IE浏览器的功能——拖拽上床。哦,
发请求有两种方式,一种是用ajax,另一种是用form提交,默认的form提交如果不做处理的话,会使页面
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号