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 相关文章推荐
调用js时ie6和ie7,ff的区别
Aug 19 Javascript
javascript判断iphone/android手机横竖屏模式的函数
Dec 20 Javascript
jQuery.extend 函数的详细用法
Jun 27 Javascript
基于jquery实现的定时显示与隐藏div广告的实现代码
Aug 22 Javascript
jquery实现点击label的同时触发文本框点击事件的方法
Jun 05 Javascript
jQuery操作cookie
Aug 08 Javascript
Kindeditor单独调用多图上传实例
Jul 31 Javascript
javascript显示动态时间的方法汇总
Jul 06 Javascript
JS调用安卓手机摄像头扫描二维码
Oct 16 Javascript
说说Vue.js中的functional函数化组件的使用
Feb 12 Javascript
vue指令之表单控件绑定v-model v-model与v-bind结合使用
Apr 17 Javascript
微信小程序地图绘制线段并且测量(实例代码)
Jan 02 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 date函数参数详解
2006/11/27 PHP
解析PHP中常见的mongodb查询操作
2013/06/20 PHP
深入php中var_dump方法的使用详解
2013/06/24 PHP
ThinkPHP实现带验证码的文件上传功能实例
2014/11/01 PHP
PHP中error_reporting()用法详解
2015/08/31 PHP
PHP使用正则表达式实现过滤非法字符串功能示例
2018/06/04 PHP
PHP单例模式实例分析【防继承,防克隆操作】
2019/05/22 PHP
js验证电话号码与手机支持+86的正则表达式
2014/01/23 Javascript
深入浅析JavaScript中的3DES
2016/08/24 Javascript
ES6学习之变量的解构赋值
2017/02/12 Javascript
vue项目关闭eslint校验
2018/03/21 Javascript
vue.js实现的绑定class操作示例
2018/07/06 Javascript
python调用新浪微博API项目实践
2014/07/28 Python
实例讲解Python中global语句下全局变量的值的修改
2016/06/16 Python
python微信公众号开发简单流程
2018/03/23 Python
基于python绘制科赫雪花
2018/06/22 Python
在pycharm中python切换解释器失败的解决方法
2018/10/29 Python
详解python的argpare和click模块小结
2019/03/31 Python
深入浅析Python中的迭代器
2019/06/04 Python
利用keras加载训练好的.H5文件,并实现预测图片
2020/01/24 Python
python实现126邮箱发送邮件
2020/05/20 Python
Python连接mysql数据库及简单增删改查操作示例代码
2020/08/03 Python
伊芙丽官方旗舰店:中国淑女一线品牌
2017/12/01 全球购物
Merchant 1948澳大利亚:新西兰领先的鞋类和靴子供应商
2018/03/24 全球购物
软件测试面试题
2015/10/21 面试题
金融专业个人求职信范文
2013/11/28 职场文书
宿舍打麻将检讨书
2014/01/24 职场文书
超市优秀员工事迹材料
2014/05/01 职场文书
劳动竞赛活动总结
2014/05/05 职场文书
如何写贫困证明申请书
2014/10/29 职场文书
2014党的群众路线教育实践活动学习心得体会
2014/10/31 职场文书
2015年党员岗位承诺书
2015/04/27 职场文书
2016五一劳动节慰问信
2015/11/30 职场文书
股东协议书范本2016
2016/03/21 职场文书
Go 通过结构struct实现接口interface的问题
2021/10/05 Golang
使用refresh_token实现无感刷新页面
2022/04/26 Javascript