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 相关文章推荐
JQuery 写的个性导航菜单
Dec 24 Javascript
Script的加载方法小结
Jan 12 Javascript
如何在指定的地方插入html内容和文本内容
Dec 23 Javascript
把字符串按照特定的字母顺序进行排序的js代码
Jan 28 Javascript
js检测网络是否具体连接功能的代码
May 23 Javascript
JavaScript 实现打印,打印预览,打印设置
Dec 30 Javascript
js限制文本框只能输入中文的方法
Aug 11 Javascript
JS DOMReady事件的六种实现方法总结
Nov 23 Javascript
javascript 中Cookie读、写与删除操作
Mar 29 Javascript
vue绑定class与行间样式style详解
Aug 16 Javascript
Angular2+如何去除url中的#号详解
Dec 20 Javascript
js将当前时间格式化为 年-月-日 时:分:秒的实现代码
Jan 20 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
牡丹941资料
2021/03/01 无线电
php AJAX实例根据邮编自动完成地址信息
2008/11/23 PHP
php数组函数序列之in_array() 查找数组值是否存在
2011/10/29 PHP
CodeIgniter使用phpcms模板引擎
2013/11/12 PHP
浅析PHP7 的垃圾回收机制
2019/09/06 PHP
基于JQuery的Pager分页器实现代码
2010/07/17 Javascript
js获取当前日期代码适用于网页头部
2013/06/27 Javascript
JavaScript生成的动态下雨背景效果实现方法
2015/02/25 Javascript
JavaScript学习笔记之DOM基础 2.4
2015/08/14 Javascript
Javascript实现苹果悬浮虚拟按钮
2016/04/10 Javascript
jquery对dom节点的操作【推荐】
2016/04/15 Javascript
仅一个form表单 js实现注册信息依次填写提交功能
2016/06/12 Javascript
基于Vue过渡状态实例讲解
2017/09/14 Javascript
特征脸(Eigenface)理论基础之PCA主成分分析法
2018/03/13 Python
Python实现简单求解给定整数的质因数算法示例
2018/03/25 Python
windows下python和pip安装教程
2018/05/25 Python
Python Django框架单元测试之文件上传测试示例
2019/05/17 Python
python gdal安装与简单使用
2019/08/01 Python
Python之指数与E记法的区别详解
2019/11/21 Python
Python tkinter之ComboBox(下拉框)的使用简介
2021/02/05 Python
Expedia泰国:预订机票、酒店和旅游包(航班+酒店)
2016/09/27 全球购物
JSP和EJB可以共享HttpSession么?EJB里面可以改变session里面的内容
2013/06/05 面试题
学年自我鉴定范文
2013/10/01 职场文书
课程设计心得体会
2013/12/28 职场文书
早餐连锁店计划书
2014/01/08 职场文书
面试自我评价范文
2014/09/17 职场文书
2015新年寄语大全
2014/12/08 职场文书
2015年爱牙日活动总结
2015/03/23 职场文书
社区党员干部承诺书
2015/05/04 职场文书
2016年社区“6.26”禁毒日宣传活动总结
2016/04/05 职场文书
javascript函数式编程基础
2021/09/15 Javascript
Pandas-DataFrame知识点汇总
2022/03/16 Python
海贼王十大潜力果实,路飞仅排第十,第一可毁世界(震震果实)
2022/03/18 日漫
SpringBoot中使用Redis作为全局锁示例过程
2022/03/24 Java/Android
详解PyTorch模型保存与加载
2022/04/28 Python
SQL SERVER中的流程控制语句
2022/05/25 SQL Server