fineuploader使用实例
1、Fine Uploader特点
Fine Uploader Features:
A:支持文件上传进度显示.
B:文件拖拽浏览器上传方式
C:Ajax页面无刷新.
D:多文件上传.
F:跨浏览器.
E:跨后台服务器端语言.
2、页面前端代码
<div id="btnUpload"></div>
$(function () { $('#btnUpload').fineUploader({ request: { endpoint: 'Handler/UpLogo.ashx' }, validation: { allowedExtensions: ['jpeg', 'jpg', 'png'] }, multiple: false, text: { uploadButton: '<div>上传头像</div>' } }).on('complete', function (event, id, fileName, responseJson) { if (responseJson.success) { $("#absoluteUrl").val(responseJson.path); $("#jcrop_target").attr("src", responseJson.url); $("#jcrop_target").css({ "width": 300, "height": 300 }); $("#preview").attr("src", responseJson.url); $("#preview").css({ "width": 100, "height": 100 }); ias.update(); } }); });
2、Handler文件代码
<%@ WebHandler Language="C#" Class="UpLogo" %> using System; using System.Web; using System.IO; using System.Text; using System.Net; using System.Data; using System.Collections; using System.Collections.Generic; using System.Drawing; using ECS.Utility; public class UpLogo : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; if (context.Request != null && context.Request.Files.Count > 0) { var HttpFile = context.Request.Files[0]; var allowedExt = new List<string> { ".jpg", ".gif", ".bmp", ".png" }; var fileExt = Path.GetExtension(HttpFile.FileName).ToLower(); var File_Name = Path.GetFileNameWithoutExtension(HttpFile.FileName); var toFileName = Guid.NewGuid().ToString() + fileExt; var toFileFullPath = context.Server.MapPath("~/UpFiles/UserTemFace/"); var viewPath = "/UpFiles/UserTemFace/"; var Title = File_Name; DirectoryInfo di = new DirectoryInfo(toFileFullPath); if (!di.Exists) { di.Create(); } ECS.Model.A_User Model = new ECS.BLL.A_User().GetModel(ValUtil.GetUserID()); if (Model != null) { //toFileName = Model.UserFaceImg; string saveFile = toFileFullPath + toFileName; //先删除临时文件 //var _filePath = toFileFullPath + "\\" + toFileName; //if (File.Exists(_filePath)) //{ // FileInfo fi = new FileInfo(_filePath); // if (fi.Attributes.ToString().IndexOf("ReadOnly") != -1) // { // fi.Attributes = FileAttributes.Normal; // } // File.Delete(_filePath); //} HttpFile.SaveAs(saveFile); Model.UserFaceImg = toFileName; new ECS.BLL.A_User().Update(Model); } string imgeUrl = ""; if (fileExt.ToLower().Equals(".jpg") || fileExt.ToLower().Equals(".gif") || fileExt.ToLower().Equals(".bmp") || fileExt.ToLower().Equals(".png")) { imgeUrl = viewPath + toFileName; } else { context.Response.Write("{success:false,msg:'只能上传图片类型的文件'}"); context.Response.End(); return; } string url = viewPath + "/" + toFileName; context.Response.Write(new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(new { success = true, url = url, path = toFileName })); context.Response.End(); } else { context.Response.Write(new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(new { success = false })); context.Response.End(); } } public bool IsReusable { get { return false; } } }
fineuploader使用实例的更多相关文章
- 最近学习工作流 推荐一个activiti 的教程文档
全文地址:http://www.mossle.com/docs/activiti/ Activiti 5.15 用户手册 Table of Contents 1. 简介 协议 下载 源码 必要的软件 ...
- fineuploader 上传jquery 控件
fineuploader 昨天用的一个jquery插件. 可参考这篇文章以前写的 file-uploader 跟 这个跟里面介绍的2个jquery 插件相比.觉得更强大写..版本号都3.9 了….. ...
- 理清fineuploader无刷新上传的一些事
1.fineuploader是一款不依赖与jquery的异步无刷新上传组件,fineuploader采用ajax方式实现对文件上传,返回值都是以json的格式,对后台服务器操作和前端dom对象一些操作 ...
- js-静态、原型、实例属性
本篇来说一下js中的属性: 1.静态属性 2.原型属性 3.实例属性 静态属性: function klass(){} var obj=new klass(); klass.count=0; klas ...
- ZIP压缩算法详细分析及解压实例解释
最近自己实现了一个ZIP压缩数据的解压程序,觉得有必要把ZIP压缩格式进行一下详细总结,数据压缩是一门通信原理和计算机科学都会涉及到的学科,在通信原理中,一般称为信源编码,在计算机科学里,一般称为数据 ...
- EntityFramework Core 1.1是如何创建DbContext实例的呢?
前言 上一篇我们简单讲述了在EF Core1.1中如何进行迁移,本文我们来讲讲EF Core1.1中那些不为人知的事,细抠细节,从我做起. 显式创建DbContext实例 通过带OnConfiguri ...
- redis集成到Springmvc中及使用实例
redis是现在主流的缓存工具了,因为使用简单.高效且对服务器要求较小,用于大数据量下的缓存 spring也提供了对redis的支持: org.springframework.data.redis.c ...
- 流程开发Activiti 与SpringMVC整合实例
流程(Activiti) 流程是完成一系列有序动作的概述.每一个节点动作的结果将对后面的具体操作步骤产生影响.信息化系统中流程的功能完全等同于纸上办公的层级审批,尤其在oa系统中各类电子流提现较为明显 ...
- UWP开发之Template10实践:本地文件与照相机文件操作的MVVM实例(图文付原代码)
前面[UWP开发之Mvvmlight实践五:SuspensionManager中断挂起以及复原处理]章节已经提到过Template10,为了认识MvvmLight的区别特做了此实例. 原代码地址:ht ...
随机推荐
- RMI基础篇
远程方法调用(Remote Method Invocation,RMI)从JDK1.1就已经实现,它大大增强了Java开发分布式应用的能力. RMI可以实现通过网络完成不同JVM间的通信,不仅可以传递 ...
- vue-router 二级路由
/** * Created by 我 on 2017/12/4. */ import Vue from 'vue' //import导入 Vue(自己起的名) from 从 vue import Vu ...
- bzoj 3864: Hero meet devil [dp套dp]
3864: Hero meet devil 题意: 给你一个只由AGCT组成的字符串S (|S| ≤ 15),对于每个0 ≤ .. ≤ |S|,问 有多少个只由AGCT组成的长度为m(1 ≤ m ≤ ...
- ------ 新春第一炮:阶乘算法性能分析与 double fault 蓝屏故障排查 Part I ------
-------------------------------------------------------------------------- 春节期间闲来无事想研究下算法,上机测试代码却遇到了 ...
- python+opencv选出视频中一帧再利用鼠标回调实现图像上画矩形框
最近因为要实现模板匹配,需要在视频中选中一个目标,然后框出(即作为模板),对其利用模板匹配的方法进行检测.于是需要首先选出视频中的一帧,但是在利用摄像头读视频的过程中我唯一能想到的方法就是: 1.在视 ...
- Asp.Net Core 2.0 之旅---在Ubuntu上部署WEB应用程序
1.Ubuntu 上 安装NET Core 2.0 SDK 第一步的安装,微软大佬已经写的非常详细了=>直达链接,按照教程来即可. 2.将我们的WEB 发布到一个文件夹,将这个文件夹打包成 压缩 ...
- Phone文件备份
一 把照片导入到本地 连接手机和PC,插上数据线后PC上会自动检测并弹出对话框,提示导入 可以指定导入的目录.确定之后点击导入即可开始执行导入操作. 二 把语音备忘录导入到本地 需要借助iTunes联 ...
- UML设计
UML设计 1. UML的概念 Unified Modeling Language(UML)又称统一建模语言或标准建模语言,是一个支持模型化和软件系统开发的图形化语言.为软件开发的所有阶段提供模型化和 ...
- 打开word时出现the setup controller has encountered a problem during install解决办法
问题电脑为win7,office是默认安装 删除下面文件夹即可解决该问题 C:\Program Files\Common Files\Microsoft Shared\OFFICE12\Office ...
- Android Stutio 3.0 - Gradle sync failed
0.Android Studio 权威教程 (url:http://blog.csdn.net/column/details/zsl-androidstudio.html) 1. 项目老是报错: Gr ...