JQuery插件ajaxfileupload.js异步上传文件实例


Posted in Javascript onMay 19, 2015

在服务器端做文件上传的过程中,如果使用web服务器短端的上传控件去上传文件的话,会导致页面刷新一次,这样对用户的体验就不是很友好了。ajaxfileupload.js是一款jQuery的异步上传文件插件,使用简单且容易上手。

前置条件:ajaxfileupload.js文件,百度下载一个就行。

JS引用:

<script src="/Content/JQueryJS/jquery-2.1.1.js"></script>

<script src="/Content/Js/ajaxfileupload.js"></script>

html代码:

 <input id="fileToUpload" type="file" name="fileToUpload">

JS代码:
function saveCInfo() {

            var filename = document.getElementById("fileToUpload").value;

            if (filename != "") {

                $.ajaxFileUpload({

                    url: '../Order/OrderExec.ashx?oprMode=fileUpload' + "&filename=" + filename + "&billno=" + billno + "&companyname=" + companyname,

                    secureuri: false,

                    fileElementId: 'fileToUpload',//上传控件ID

                    //dataType: 'json',

                    error: function () { alert('error'); },

                    success: function (datax) {

                        if (datax != "") {

                            msgShow('系统提示', '上传成功!', 'info');

                        } else {

                            msgShow('系统提示', '上传失败!', 'info');

                        }

                    }

                });

            } else {

                $.messager.alert('提示', '请选择上传文件', 'info');

            }

        }

后台代码:
public void FileUpload(HttpContext context)

        {

            try

            {

                context.Response.ContentType = "text/html";

                string companyname = context.Request.Params["companyname"];

                string billno = context.Request.Params["billno"];

                string filename = context.Request.Params["filename"];

                string name = companyname + "_" + billno + "_" + filename;

                HttpFileCollection files = HttpContext.Current.Request.Files;

                //指定上传文件在服务器上的保存路径 

                string savePath = context.Server.MapPath("~/upload/");

                //检查服务器上是否存在这个物理路径,如果不存在则创建 

                if (!System.IO.Directory.Exists(savePath))

                {

                    System.IO.Directory.CreateDirectory(savePath);

                }

                savePath = savePath + name;//上传文件路径

                files[0].SaveAs(savePath);//保存文件 

                context.Response.Write(savePath);

            }

            catch (Exception ex)

            {

                context.Response.Write("FileUpload: " + ex.Message);

            }
        }
Javascript 相关文章推荐
cument.execCommand()用法深入理解
Dec 04 Javascript
javascript:void(0)使用探讨
Aug 27 Javascript
JS Ajax请求如何防止重复提交
Jun 13 Javascript
Angular.js中定时器循环的3种方法总结
Apr 27 Javascript
微信小程序开发图片拖拽实例详解
May 05 Javascript
Webpack实现按需打包Lodash的几种方法详解
May 08 Javascript
详解cordova打包成webapp的方法
Oct 18 Javascript
vue slot与传参实例代码讲解
Apr 28 Javascript
如何利用vue+vue-router+elementUI实现简易通讯录
May 13 Javascript
JS数组Object.keys()方法的使用示例
Jun 05 Javascript
基于JavaScript实现单例模式
Oct 30 Javascript
详谈Object.defineProperty 及实现数据双向绑定
Jul 18 Javascript
7个有用的jQuery代码片段分享
May 19 #Javascript
浅谈jQuery页面的滚动位置scrollTop、scrollLeft
May 19 #Javascript
javascript检测两个数组是否相似
May 19 #Javascript
10条建议帮助你创建更好的jQuery插件
May 18 #Javascript
原生js实现的贪吃蛇网页版游戏完整实例
May 18 #Javascript
JQuery中层次选择器用法实例详解
May 18 #Javascript
Jquery中基本选择器用法实例详解
May 18 #Javascript
You might like
php算开始时间到过期时间的相隔的天数
2011/01/12 PHP
PHP读取文件并可支持远程文件的代码分享
2012/10/03 PHP
浅析PHP中Collection 类的设计
2013/06/21 PHP
php中JSON的使用方法
2015/04/30 PHP
php实现zip文件解压操作
2015/11/03 PHP
PHP检测链接是否存在的代码实例分享
2016/05/06 PHP
PHP自定义错误处理的方法分析
2018/12/19 PHP
javascript 面向对象继承
2009/11/26 Javascript
jQuery中的.bind()、.live()和.delegate()之间区别分析
2011/06/08 Javascript
gridpanel动态加载数据的实例代码
2013/07/18 Javascript
js sort 二维数组排序的用法小结
2014/01/24 Javascript
轻松学习jQuery插件EasyUI EasyUI创建RSS Feed阅读器
2015/11/30 Javascript
javascript每日必学之运算符
2016/02/16 Javascript
拥有一个属于自己的javascript表单验证插件
2016/03/24 Javascript
JavaScript实现设计模式中的单例模式的一些技巧总结
2016/05/17 Javascript
JS判断数组那点事
2017/10/10 Javascript
js的函数的按值传递参数(实例讲解)
2017/11/16 Javascript
vue 实现复制内容到粘贴板clipboard的方法
2018/03/17 Javascript
angular 未登录状态拦截路由跳转的方法
2018/10/09 Javascript
基于ssm框架实现layui分页效果
2019/07/27 Javascript
autojs 蚂蚁森林能量自动拾取即给指定好友浇水的实现方法
2020/05/03 Javascript
[02:17]2016完美“圣”典风云人物:Sccc专访
2016/12/03 DOTA
[01:19:33]DOTA2-DPC中国联赛 正赛 iG vs VG BO3 第一场 2月2日
2021/03/11 DOTA
使用setup.py安装python包和卸载python包的方法
2013/11/27 Python
Python3.2中的字符串函数学习总结
2015/04/23 Python
详解python使用递归、尾递归、循环三种方式实现斐波那契数列
2018/01/16 Python
详解Python中的四种队列
2018/05/21 Python
python中使用ctypes调用so传参设置遇到的问题及解决方法
2019/06/19 Python
浅谈Python3中print函数的换行
2020/08/05 Python
西安夏日科技有限公司Java笔试题
2013/01/11 面试题
工厂总经理岗位职责
2014/02/07 职场文书
广告设计应届生求职信
2014/03/01 职场文书
新娘婚礼致辞
2015/07/27 职场文书
小学毕业感言100字
2015/07/30 职场文书
Python pygame实现中国象棋单机版源码
2021/06/20 Python
生命的关键成分来自太空?陨石说是的
2022/04/29 数码科技