1.此文章是用原生JS来进行文件的上传，有两个版本，一个不用ajax，一个用ajax。

1）非AJAX

<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <meta charset="utf-8" />

</head>

<body>

<form id="upload-form" action="Template/UploadBusinessImage" method="post" enctype="multipart/form-data">

    <input type="file" id="upload" name="ProductImage"/> <br/>

    <input type="submit" value="上传"/>

</form>

</body>

</html>

2）AJAX

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <meta charset="utf-8"/>

    <script>

        /*原生JS版*/

        function updateFile() {

             /* FormData 是表单数据类 */

             var fd = new FormData();

             var ajax = new XMLHttpRequest();

             fd.append("upload", 1);

             /* 把文件添加到表单里 */

             fd.append("ProductImage", document.getElementById("upfile").files[0]);

             ajax.open("post", "Template/UploadBusinessImage", true);

             ajax.onload = function () {

             console.log(ajax.responseText);

            };

         ajax.send(fd);

        }

    </script>

</head>

<body>

    <p><input type="file" id="upfile"></p>

    <p><input type="button" id="upJS" value="用原生JS上传" onclick="updateFile()"></p>

</body>

</html>

2. 后台

        public ActionResult UploadBusinessImage(HttpPostedFileBase ProductImage)

        {

            string error = "";

            try

            {

                //文件上传

                HttpPostedFileBase postFileBase = ProductImage;

                //文件后缀

                string extension = Path.GetExtension(postFileBase.FileName);

                //文件流

                Stream uploadStream = postFileBase.InputStream;

                //把文件写入到本地E盘

                using (var fileStream = System.IO.File.Create("E:\\" + postFileBase.FileName))

                {

                    uploadStream.Seek(0, SeekOrigin.Begin);

                    uploadStream.CopyTo(fileStream);

                }

                return this.Json(error, JsonRequestBehavior.AllowGet);

            }

            catch (Exception e)

            {

                return this.Json(e.Message, JsonRequestBehavior.AllowGet);

            }

        }

C# 用原生JS进行文件的上传的更多相关文章

  1. ajax和原生ajax、文件的上传

    ajax理解: ajax发送的请求是异步处理的.也就是说如下形式: function f1(){ $.ajax( { ....... success:function(){ a= return a } ...

  2. js分割文件快速上传

    <?php header('Content-type:text/html;charset=UTF-8'); ?> <?php if ($_FILES) { if(!file_exis ...

  3. js实现文件的上传和输出,拖拽上传图片

    js文件上传 文件下载 以前的文件的下载都是在服务器,现在也是放在服务器比较好,有时候为了一些开发的方便,我们临时把处理的数据就放在了本地,然后自己访问.这个也是可以的. 1.利用html5的 Fil ...

  4. Ext.js多文件选择上传,

    工作了之后来到了一家用Ext.js的公司, 一开始的时候做项目, 我被分给一个做一个单表的增删改查, 再加上文件上传功能, 带我的老师让我自己研究一下Ext.js怎么多文件选择上传, 并且能获取到上传 ...

  5. js大文件分块上传断点续传demo

    文件夹上传:从前端到后端 文件上传是 Web 开发肯定会碰到的问题,而文件夹上传则更加难缠.网上关于文件夹上传的资料多集中在前端,缺少对于后端的关注,然后讲某个后端框架文件上传的文章又不会涉及文件夹. ...

  6. nodeJs + js 大文件分片上传

    简单的文件上传 一.准备文件上传的条件: 1.安装nodejs环境 2.安装vue环境 3.验证环境是否安装成功 二.实现上传步骤 1.前端部分使用 vue-cli 脚手架,搭建一个 demo 版本, ...

  7. 用原生JS实现多张图片上传及预览功能（兼容IE8）

    最近需要做一个图片上传预览的功能(兼容IE8-11.chrome.firefox等浏览器),网上现有的文件上传组件(如webuploader)总是会遇到一些兼容性问题.于是我参考了一些博文(链接找不到 ...

  8. 原生JS实现异步图片上传（预览）

    效果 实现过程分为两步 1. 用户点击添加后通过 H5文件读取 FileReader对象以DataURL的格式读取图片 2. 通过FormData对象生成表单数据,通过ajax上传到后台 HTML & ...

  9. js大文件分割上传

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

随机推荐

  1. Maven的配置和使用（三）

    下面记录下如何使用Maven进行jar包的管理和更新. 在Maven中我们是通过对pom.xml文件的配置来对项目的包进行管理的,找到该文件并打开: <project xmlns="h ...

  2. MVC Html.BeginForm 与 Ajax.BeginForm 使用总结

    最近采用一边工作一边学习的方式使用MVC5+EF6做一个Demo项目, 期间遇到不少问题, 一直处于研究状态, 没能来得及记录. 今天项目进度告一段落, 得以有空记录学习中遇到的一些问题. 由于MVC ...

  3. xpath使用

    一.安装(win7 64) 1.安装lxml,pip install lxml 2.如果安装出错,下载lxml-3.5.0b1.win-amd64-py2.7.exe: 地址:http://www.l ...

  4. 将库打包到nuget服务器

     前言 由于目前.net core无法引用本地的 assembly ,所以尝试将项目的依赖库打包到nuget服务器.  相关的工具 Nuget Package Explorer 参考文档 dotnet ...

  5. 【BZOJ1623】 [Usaco2008 Open]Cow Cars 奶牛飞车 贪心

    SB贪心,一开始还想着用二分,看了眼黄学长的blog,发现自己SB了... 最小道路=已选取的奶牛/道路总数. #include <iostream> #include <cstdi ...

  6. jmobile学习之路 ---- 视口

    当我们的浏览器在窗口最大化的时候,此时屏幕的宽度,就是我们桌面的分辨率.这个规则仅仅适用于PC! 我们试图在iPhone中输出屏幕宽度,你会发现屏幕宽度是980!居然和PC屏幕差不多大! 苹果主导的这 ...

  7. sql2000分享 批量建表dev_编号

    批量建表dev_3970000000014到dev_3970000000035 declare @i bigint declare @j int ) ) ) ) set @sql = '' set @ ...

  8. _MSC_VER详细介绍

    _MSC_VER详细介绍 转自:http://www.cnblogs.com/braver/articles/2064817.html _MSC_VER是微软的预编译控制. _MSC_VER可以分解为 ...

  9. sql 连接数不释放 ，Druid异常：wait millis 40000, active 600, maxActive 600

    Hibernate + Spring + Druid 数据库mysql 由于配置如下 <bean id="dataSource" class="com.alibab ...

  10. 最长下降子序列O(n^2)及O(n*log(n))解法

    求最长下降子序列和LIS基本思路是完全一样的,都是很经典的DP题目. 问题大都类似于 有一个序列 a1,a2,a3...ak..an,求其最长下降子序列(或者求其最长不下降子序列)的长度. 以最长下降 ...