//上传文件
function UploadFile(el) {
var dataValue = $(el).attr("data-id");
var ele = dataValue.toLowerCase();
var f = document.getElementById('uploadFile_'+ele).files[0]
var src = window.URL.createObjectURL(f);
document.getElementById('uploadPreview_' + ele).src = src;
top.$("#uploadPreview_" + ele).attr("src", src);
$("#upload_msg_" + ele).text("上传中,请稍候...");
//上传应用图标
$.ajaxFileUpload({
url: "../../Manage/Flow/UploadFile",
secureuri: false,
fileElementId: ['uploadFile_' + ele],
dataType: 'json',
success: function (data) {
if ((data.message).indexOf('error') >= 0) {
$("#upload_msg_" + ele).text(data.message);
$("#upload_msg_" + ele).css("color", "red");
} else {
$("#" + dataValue).val(data.message);
$("#upload_msg_" + ele).text("上传成功!");
$("#upload_msg_" + ele).css("color", "#0a9a2f");
}
}
});
}

注意要加载上传组件js .下载地址:https://blog-static.cnblogs.com/files/firstcsharp/ajaxfileupload.js

关于后台的上传代码就不用说了吧?网上一大把

C# MVC Ajax上传多个图片,可预览,可重复上传等的更多相关文章

  1. jQuery+Ajax实现图片的预览和上传

    jQuery+Ajax实现图片的预览和上传 1.配置Spring-web.xml <!-- springmvc上传图片 --> <bean id="multipartRes ...

  2. Android图片上传,可以选择多张图片,缩放预览,拍照上传等

    仿照微信,朋友圈分享图片功能 .可以进行图片的多张选择,拍照添加图片,以及进行图片的预览,预览时可以进行缩放,并且可以删除选中状态的图片 .很不错的源码,大家有需要可以下载看看 . 微信 微信 微信 ...

  3. Android仿微信图片上传,可以选择多张图片,缩放预览,拍照上传等

    仿照微信,朋友圈分享图片功能 .可以进行图片的多张选择,拍照添加图片,以及进行图片的预览,预览时可以进行缩放,并且可以删除选中状态的图片 .很不错的源码,大家有需要可以下载看看 . 微信 微信 微信 ...

  4. 纯javascript代码实现浏览器图片选择预览、旋转、批量上传

    工作中遇到的业务场景,和同事一起研究了下,主要是为了兼容IE版本 其实就是一些琐碎的知识点在网上搜集下解决方式,然后集成了下,主要有以下点: 1. IE input type=file的图片预览要用I ...

  5. Thinkphp5+plupload图片上传功能,支持实时预览图片。

    今天和大家分享一个国外的图片上传插件,这个插件支持分片上传大文件.其中著名的七牛云平台的jssdk就使用了puupload插件,可见这个插件还是相当牛叉的. 这个插件不仅仅支持图片上传,还支持大多数文 ...

  6. 移动端 H5 拍照 从手机选择图片,移动端预览,图片压缩,图片预览,再上传服务器

    前言:最近公司的项目在做全网营销,要做非微信浏览器的wap 站 的改版,其中涉及到的一点技术就是采用H5 选择手机相册中的图片,或者拍照,再将获取的图片进行压缩之后上传. 这个功能模块主要有这5点比较 ...

  7. jQuery + ashx 实现图片按比例预览、异步上传及显示

    目录(?)[-] 注ajax 方式异步读取数据库显示图片的方法同上传一致使用 ashx 返回base64字符串在客户端处理即可 记录一个让我纠结良久的问题 在Page_Load 函数中只有第一个用 S ...

  8. .net core版 文件上传/ 支持批量上传,拖拽以及预览,bootstrap fileinput上传文件

    asp.net mvc请移步 mvc文件上传支持批量上传,拖拽以及预览,文件内容校验 本篇内容主要解决.net core中文件上传的问题  开发环境:ubuntu+vscode 1.导入所需要的包:n ...

  9. java压缩包上传,解压,预览(利用editor.md和Jstree实现)和下载

    java压缩包上传,解压,预览(利用editor.md和Jstree实现)和下载 实现功能:zip文件上传,后台自动解压,Jstree树目录(遍历文件),editor.md预览 采用Spring+Sp ...

  10. 浅谈简单实现file控件的图片预览,裁剪和上传。

    1.图片预览之FileReader对象    FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用File或Blob对象指定要读取的文件或数据 ...

随机推荐

  1. gitlab及jenkins

    1.安装配置gitlab服务,在gitlab新建一个仓库,配置本地密钥,并通过ssh方式拉取gitlab仓库代码 https://packages.gitlab.com/gitlab/gitlab-c ...

  2. Python日记(二):Python之禅

    The Zen of Python, by Tim Peters Beautiful is better than ugly. Explicit is better than implicit. Si ...

  3. 191012 python3关于空格打印、赋值、+=符号的小坑

    1. python3中,直接打印空格不显示,不论是pycharm,cmd命令窗口,还是linux中,都有尝试,但是空格' '不能显示出来: # 打印菱形,只能用center方法for i in ran ...

  4. HTML&CSS基础-属性选择器

    HTML&CSS基础-属性选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> & ...

  5. Vuex基础 -01 -实现简易计数器 -支持 加数/ 减数/ 奇数再加/ 异步加法(setTimeout 1000ms) -单组件演示语法

    Vuex 的结构图 工程组织 Vuex的核心管理程序 store.js /* vuex的核心管理程序 */ import Vue from 'vue' import Vuex from 'vuex' ...

  6. 《发际线总是和我作队》第九次作业:Beta冲刺Scrum Meeting3

    项目 内容 这个作业属于哪个课程 软件工程 这个作业的要求在哪里 实验十三 团队作业9:Beta冲刺与团队项目冲刺 团队名称 发际线总和我作队 作业学习目标 (1)掌握软件黑盒测试技术:(2)掌握软件 ...

  7. TP5.x——initialize()中如何return

    前言 首先在tp框架中initialize中是无法直接通过return来返回任何值的,return并不会造成脚本的中断! 环境:PHP 7.0.4 | TP5.1 说明 initialize方法 首先 ...

  8. HashMap的个别方法

    static final int DEFAULT_INITIAL_CAPACITY = 1 << 4; // 16 默认初始容量 16 static final int MAXIMUM_C ...

  9. [JSOI2018]战争

    题目描述 九条可怜是一个热爱读书的女孩子. 在她最近正在读的一本小说中,描述了两个敌对部落之间的故事.第一个部落有 nnn 个人,第二个部落有 mmm 个人,每一个人的位置可以抽象成二维平面上坐标为 ...

  10. NISP二级笔记(一) 信息安全管理

    ISO27001 信息安全管理体系要求 ISO27002 信息安全控制措施(实用规则) ISO27003 信息安全管理体系实施指南 ISO27004 信息安全管理测量 ISO27005 信息安全风险管 ...