jquery 和 FormData 最简单图片异步上传

<script src="/scripts/jquery/jquery-3.1.1.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var fileInfo = $(‘#file‘).prop(‘files‘)[0];
            var fm = new FormData();
            fd.append("xxxx", fileInfo);
            $.post("url", fm, function (rs) { }, "json");
        })
    </script>

  

时间: 2024-11-05 13:41:01

jquery 和 FormData 最简单图片异步上传的相关文章

C#中使用iframe结合js实现图片异步上传

将图片上传的页面放在iframe中,通过iframe跳转到另一个页面,在该页中将图片提交到服务器,而不需要对主页进行刷新,提交成功后用脚本(回调函数)实现上传的图片在主页面的显示. 图片选择页面 Add.aspx <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Add.aspx.cs" Inherits="_Add" %> <!DOCTYPE h

使用FormData实现ajax文件异步上传

1.传统的web开发文件上传一般是基于form表单的文件上传,同步的方式,用户体验差,可控性也差 2.异步上传的实现 有以下方式 2.1 借助浏览器插件 一般需要安装一些类似flash的插件  这种方式 缺点:需要安装插件  优点:可控性强,性能高 2.2 这种是伪异步上传,借助表单向隐藏的iframe提交,然后通过iframe通信操作当前页面 这种方式可控行查,体验一般,见下面代码  2.3 借助html5 里的 FormData 对象,可实现进度控制,异步的上传方式,见代码 iframe方式

html5图片异步上传/ 表单提交相关

1 form 表单 get/post提交时候. action地址(或者啥ajax的url地址) 会涉及到跨域问题 常见跨域问题http://www.cnblogs.com/rainman/archive/2011/02/20/1959325.html 举例: 第一种写法 相对路径 $.get('localhost:8080/test_upload/aservlet', { }, function (data) { }); test_upload 为项目名 这里写的为相对路径,不会出现问题 第二种

微信开发--图片异步上传。

一.需求 微信网页中实现上传头像,用户信息,用户宣传照的功能. 二.问题 微信网页上传普通浏览器的上传不一样,微信内置浏览器禁止了普通的input上传功能,并且此标签在有些移动终端显示不佳. 三.解决 使用微信官方文档提供的jssdk的上传图片接口.微信自己的jssdk里面的图片上传不用考虑兼容性. 具体实现逻辑是: 配置好jssdk后,可以使用jssdk上传接口上传图片到微信服务器,微信服务器会返回给你一个资源id,我们在使用js异步或者表单同步把资源id传输到php服务器端,php服务器端就

asp.net使用jquery.form实现图片异步上传

首先我们需要做准备工作: jquery下载:http://files.cnblogs.com/tianguook/jquery1.8.rar jquery.form.js下载:http://files.cnblogs.com/tianguook/jquery.form.js 页面JqueryFormTest.aspx: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryForm

JQUery利用Uploadify插件实现文件异步上传(十一)

一:简介: Uploadify是JQuery的一个上传插件,实现的效果非常好,带进度显示 ,且Ajax异步,能一次性上传多个文件,功能强大,使用简单 1.支持单文件或多文件上传,可控制并发上传的文件数 2.在服务器端支持各种语言与之配合使用,诸如PHP,.NET,Java…… 3.通过参数可配置上传文件类型及大小限制 4.通过参数可配置是否选择文件后自动上传 5.易于扩展,可控制每一步骤的回调函数(onSelect, onCancel……) 6.通过接口参数和CSS控制外观 二:官方下载 htt

ajax图片上传,图片异步上传,更新

继承前文:图片上传_ajax上传之实际应用(附上Demo) 直接上源码吧: js源码: /// <reference path="jquery-1.8.3.js" /> /// <reference path="ajaxForm/jquery.form.js" /> /*! * jQuery upload * 用于上传单个文件,上传成功后,返回文件路径. * 本插件依赖jQuery,jquery.form 请在使用时引入依赖的文件 * * D

jquery mobile 表单提交 图片/文件 上传

jquerymobile 下面 form 表单提交 和普通html没区别,最主要是 <form 要加一个 data-ajax='false' 否则 上传会失败 1  html代码 <!doctype html><html><head>    <meta name="viewport" content="width=device-width, initial-scale=1" charset="UTF-8&qu

html+servlet实现多图片异步上传

html页面 <!doctype html> <html> <head> <meta charset="utf-8"> <title>点击上传</title> <script src="js/jquery-1.11.1.js"></script> <script src="js/ajaxfileupload.js"></script&