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. Python 学习第十六天 html 前端内容总结

    一,css知识总结 1, css属性 css的属性包括以下内容 position:规定元素的定位类型 background:属性在一个声明中设置所有的背景属性 可以设置的如下属性:   (1)back ...

  2. D3中selection之使用

    1. 极为重要的reference: [1] How selections works. http://bost.ocks.org/mike/selection/ [2] Nested selecti ...

  3. SQL常见优化Sql查询性能的方法有哪些？

    常见优化Sql查询性能的方法有哪些? 1.查询条件减少使用函数,避免全表扫描 2.减少不必要的表连接 3.有些数据操作的业务逻辑可以放到应用层进行实现 4.可以使用with as 5.使用“临时表”暂 ...

  4. Pascal 语言中的关键字及保留字

    absolute //指令(变量) abstract //指令(方法) and //运算符(布尔) array //类型 as //运算符(RTTI) asm //语句 assembler //向后兼 ...

  5. 使EditText不要在页面打开时自动获取焦点（因为软键盘会自动弹出）

    当页面上有EditText时,第一个EditText会在页面打开时自动的获取焦点,这样带来的问题就是系统键盘会自动的弹出来. 解决方法比较简单只要为EditText的父控件设置一下就行了: andro ...

  6. iframe框架用法

    1.iframe标签: <iframe src="demo1.html" name="qiuqiu_Page" frameborder="0&q ...

  7. Struts2的OGNL表达式语言

    一.OGNL的概念 OGNL是Object-Graph Navigation Language的缩写,全称为对象图导航语言,是一种功能强大的表达式语言,它通过简单一致的语法,可以任意存取对象的属性或者 ...

  8. HDU 1394 Minimum Inversion Number ( 树状数组求逆序数 )

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1394 Minimum Inversion Number                         ...

  9. OpenCV学习笔记（一）——OpenCV3.1.0+VS2015开发环境配置

    摘要: 由于最近AR(增强现实)这个概念非常火爆,各种基于AR的应用及游戏逐渐面向大众,而在AR中最重要的两个技术就是跟踪识别和增强渲染,其中跟踪识别是通过OpenCV这个开源的计算机视觉库来实现的, ...

  10. [转]关于SVN的操作批处理示例

    为了一句话:不要动手做机器能够做的事情. 天天工作用svn,更新啥的打开目录啥的动作天天在重复.每次写些命令也蛮无聊的,不说了,看下面: @echo off rem 显示部分 @echo 注 意 事 ...