JS将文件像form表单一样提交到后台
这是很简单。。
HTML
<div>
                          <input type="file" id="myfile">
                          <input type="button" value="上传" onclick="HeadPortraitPicture()">
                    </div>
JS代码
function HeadPortraitPicture()
	 {
	          if (document.getElementById('myfile').files[0] != null) {//判断上传的文件是否为空
	                var fd = new FormData();
	                fd.append("fileToUpload", document.getElementById('myfile').files[0]);//这是获取上传的文件
	                var xhr = new XMLHttpRequest();
	                xhr.open("POST", "/DEMO/SettingCode/Exceltolead?type=doExcel");//要传到后台方法的路径
	                xhr.upload.addEventListener("progress", uploadProgress, false);
	                xhr.addEventListener("load", uploadComplete, false);//返回来的数据
	                xhr.addEventListener("error", uploadFailed, false);//返回异常
	                xhr.addEventListener("abort", uploadCanceled, false);//返回连接异常
	                xhr.send(fd);//放入文件发送到后台
	          }
	 }
  function uploadProgress(evt) {
        if (evt.lengthComputable) {
              //var percentComplete = Math.round(evt.loaded * 100 / evt.total);//可以在这里接收进度条数据
        }
        else {
              alert("无法计算!");
        }
  }
  function uploadComplete(evt) {
        /* 服务器返回数据*/
      var message = evt.target.responseText;//接收返回来的数据
  }
function uploadFailed(evt) {
        alert("上传出错.");
  }
function uploadCanceled(evt) {
        alert("上传已由用户或浏览器取消删除连接.");
  }
JS将文件像form表单一样提交到后台的更多相关文章
- JS将文件以form表单一样提交到后台
		
这是很简单.. HTML <div> <input type="file" id="myfile"> <input type=&q ...
 - jQuery动态创建form表单并提交到后台(携带一定的数据进行页面跳转)
		
今天遇到这么一个需求,携带一个编号一个名字跳转到另一个JSP页面,直接页面跳转(get携带数据)的话不太安全,于是想到到后台转发一下. 第一种:直接以表单提交方式的进行 JS代码: var form ...
 - asp.net中通过form表单submit提交到后台的实例
		
前台<body>中的代码: <body> <div id="top"> </div> <form id="login ...
 - 使用ajax方法实现form表单的提交(附源码)
		
写在前面的话 在使用form表单的时候,一旦点击提交触发submit事件,一般会使得页面跳转,页面间的跳转等行为的控制权往往在后端,后端会控制页面的跳转及数据传递,但是在某些时候不希望页面跳转,或者说 ...
 - 利用 ajax自定义Form表单的提交方式
		
需求场景:有时候单纯的form表单无法向后端传递额外的参数 比如需要action传递js异步生成的参数 ,form表单默认的action就无法满足需求,这时就需要我们自定义form表单的提交方式. h ...
 - form表单的提交方式
		
开发中表单提交是很常见的,表单的提交方式也多种方式. 1.使用submit按钮提交表单 <input type="submit"/> <!DOCTYPE htm ...
 - 使用ajax方法实现form表单的提交
		
作者:13 GitHub:https://github.com/ZHENFENG13 版权声明:本文为原创文章,未经允许不得转载. 写在前面的话 在使用form表单的时候,一旦点击提交触发submit ...
 - 基于form表单submit提交不跳转
		
方法一:target <html> <body> <form action="" method="post" target=&qu ...
 - JavaScript 创建一个 form 表单并提交
		
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...
 
随机推荐
- django DatabaseFunctions
			
from django.db.functions import ... Cast() 转换类型 value = Value.objects.annotate(field_as_float=Cast(' ...
 - link和@import的区别是什么 ?
			
1.link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务:@import属于CSS范畴,只能加载CSS. 2.link引入CSS是,在页面载入时间同时加载:@import页面网页完全 ...
 - 洛谷P2495 [SDOI2011]消耗战(虚树)
			
题面 传送门 题解 为啥一直莫名其妙\(90\)分啊--重构了一下代码才\(A\)掉-- 先考虑直接\(dp\)怎么做 树形\(dp\)的时候,记一下断开某个节点的最小值,就是从根节点到它的路径上最短 ...
 - jquery源码解析:proxy,access,swap,isArraylike详解
			
jQuery的工具方法,其实就是静态方法,源码里面就是通过extend方法,把这些工具方法添加给jQuery构造函数的. jQuery.extend({ ...... guid: 1, //唯一标识符 ...
 - mysql高级内容
			
一. 简介 实体与实体之间有3种对应关系,这些关系也需要存储下来 在开发中需要对存储的数据进行一些处理,用到内置的一些函数 视图用于完成查询语句的封装 事务可以保证复杂的增删改操作有效 二. 关系 创 ...
 - Levenshtein字符串距离算法介绍
			
Levenshtein字符串距离算法介绍 文/开发部 Dimmacro KMP完全匹配算法和 Levenshtein相似度匹配算法是模糊查找匹配字符串中最经典的算法,配合近期技术栏目关于算法的探讨,上 ...
 - maven中archetype(原型)的使用
			
原文链接:https://www.cnblogs.com/snowstar123/p/3449349.html 最近项目组做好一套框架,为了推广需要创建一些空白项目给项目组使用,因为所有的空白项目里面 ...
 - JavaWeb学习笔记(十六)—— 事务
			
一.事务概述 1.1 什么是事务 银行转账!张三转10000块到李四的账户,这其实需要两条SQL语句: 给张三的账户减去10000元: 给李四的账户加上10000元. 如果在第一条SQL语句执行成功后 ...
 - python小游戏开发关于pygame库的安装
			
---恢复内容开始--- 测试环境:运行环境 Window 10 64bit上运行 前提条件 python3.7(当前时间最新版本20181021)安装(记住安装路径如C:\application\p ...
 - 溶解shader
			
玩神界原罪2,感觉人物被建筑遮挡时,建筑的“溶解”效果很有意思,想实现一下.然后发现连溶解都没实现过,emmmmm....先来把溶解实现了~ 原理就是根据一张噪声图的值是否大于某个阈值,来判断是否丢弃 ...