上传照片图片

发表评论:
TA的最新馆藏[转]&[转]&[转]&[转]&[转]&[转]&未注册过用户可以点击直接登录哦!
使用注册邮箱登录
选择画板...
你已经成功采集到
&|关闭窗口MVC 图片上传详解 - stoneniqiu - 推酷
MVC 图片上传详解 - stoneniqiu
& & &图片上传的插件很多,但正真很难十分切合我们的需求。我这里讲的是用一个flie元素上传4张照片的一个Demo。用到了bootstrap和form.js。最终效果图如下:
& & 有些人可能看着熟悉,这个原型是花田网站中上传图片插件的样式。
&script src=&../../Scripts/jquery-ui-1.9.2.custom.min.js&&&/script&
&script src=&../../Scripts/jquery-1.8.3.js&&&/script&
&link href=&../../Content/bootstrap/css/bootstrap.min.css& rel=&stylesheet& /&
&script src=&../../Content/bootstrap/js/bootstrap.min.js&&&/script&
&script src=&../../Content/JS/form.js&&&/script&
& & & & 一般的file文件需要选择浏览,选中图片,再点确定才能提交。 但插件提供的一般都是直接选择照片就可以预览了。其实是让file文件自动提交了存入临时文件夹,形成预览图片。而提交动作当然是要有form元素来完成。因为上传的动作都是一样的,所以我想用一个file就行了。file自动提交后台只要符合格式和大小就会先存入临时文件夹,用户如果要删除就删除临时文件夹中的图片。而提交是简单的事情了,只需要把之前的图片地址存入数据库,再把临时文件中的文件move到规范的文件夹中就可以。 以上就是整个思路。 代码如下:
& &html如下:最后面有一个隐藏的form,才是真正上传幕后。
&div id=&imgupload& class=&modal hide fade& tabindex=&-1& role=&dialog& aria-labelledby=&myModalLabel& aria-hidden=&true&&
&div class=&modal-header&&
&button type=&button& class=&close& data-dismiss=&modal& aria-hidden=&true&&&&/button&
&h4&上传图片&/h4&
&div class=&modal-body&&
&div class=&uploadbox& data-count=&0& style=&display:&&
&span class=&closespan& title=&删除照片&&&&/span&
&div class=&imgcontainer&&
&div class=&add&&+&/div&
&div class=&stt&&点击上传&/div&
&span class=&infospan&&
&img src='../../Content/Photos/loading.gif' /&正在上传...&/span&
&div class=&uploadbox& data-count=&0&
&span class=&closespan& title=&删除照片&&&&/span&
&div class=&imgcontainer&&
&div class=&add&&+&/div&
&div class=&stt&&点击上传&/div&
&span class=&infospan&&上传成功2&/span&
&div class=&uploadbox&data-count=&0& &
&span class=&closespan& title=&删除照片&&&&/span&
&div class=&imgcontainer&&
&div class=&add&&+&/div&
&div class=&stt&&点击上传&/div&
&span class=&infospan&&上传成功3&/span&
&div class=&uploadbox&data-count=&0&
&span class=&closespan& title=&删除照片&&&&/span&
&div class=&imgcontainer&&
&div class=&add&&+&/div&
&div class=&stt&&点击上传&/div&
&span class=&infospan&&上传成功4&/span&
&div class=&inputdiv&&&input type=&text& disabled=&disabled& id=&Remark& name=&Remark& placeholder=&补充说明下~&/&&/div&
&div class=&modal-footer&&
上传大小在8k-10M之间 &span class=&imguploadmessage&&&/span&
&button class=&btn btn-success &
disabled=&disabled&
id=&imgsubmit&&发布&/button&
&form action=&/User/UpLoadPhoto& method=&POST& enctype=&multipart/form-data& name=&ImgForm& id=&ImgForm&&
&input type=&file& name=&file& id=&imgFlie&
required=&required& /&
&input type=&submit& name=&subt& value=&上传图片& /&
&1.初始的时候显示一个上传块,上传完成一个图片后才会显示下一个块。切这个块始终在最后面。2.没有上传图片的时候 描述框和发布按钮都要是disabled状态。3上传完成之后的照片不允许再次点击上传,要再次上传先删掉原来的照片。
//图片上传-------------------------------------imgupload---------------------
var imgbox = {};//用来获取当前点击的块
因为块的顺序是变动的,所以用each函数是不准确的。
var childs = $(&.imgcontainer:eq(0)&).html();
$(&.uploadbox&).click(function () {
var tag = $(this).attr(&data-count&);// 我增加了一个data-count属性来判断是否已经存在照片,给div加disabled貌似没有用。
if (tag == &1&) return false;//表示上传完成
$(&#imgFlie&).click(); //点击上传块 其实是点击file元素,触发用户选择图片
imgbox = $(this);
var stm1 = setInterval(function () { //用timer来判断用户是否选择了图片 如果选择了就自动提交。 如果你有更好的办法,欢迎指出。
var imgstr = $(&#imgFlie&).val();
if (imgstr != &&) {
clearInterval(stm1);
$(&#ImgForm input[type='submit']&).click();
return false;
// 取消照片
$(&.closespan&).click(function (e) {
e.stopPropagation();
var sum = $(&.uploadbox img&).
// 保证有一个框可以让用户再次选择 需要显示childs 设置data-count属性 必要的再隐藏
var imgsrc = $(this).next().find(&img&).attr(&src&);
$(this).next().html(&&).append(childs);
// 隐藏关闭和成功提示
$(this).hide();
$(this).siblings(&.infospan&).hide();
$(this).parent().attr(&data-count&, 0).insertBefore($(&.inputdiv&));//取消之后,还原data-count属性 然后插入到上传块队列的最后 也就是描述框前面
if (sum & 4) {//说明此时是有一个在准备状态,这个可以直接做删除处理
// 设置data-count 并隐藏父级
$(this).parent().hide();
//需要移位 保证准备状态的总是在最后一个
// 清除session 减少一个字符串
if (imgsrc != undefined) {
$.post(&/User/DeleteImg&, { str: imgsrc }, function () {//清楚src 和图片
if (sum == 1) {
$('#Remark,#imgsubmit').attr(&disabled&, &disabled&); //表示这个时候还没有图片,禁止提交键和描述框
//----------上传图片---------------------------------------------
$(&#imgsubmit&).click(function () {
var imgcontent = $.trim($(&#Remark&).val());
$.post(&/User/SaveImgs&, { content: imgcontent }, function (data) {
if (data == 1) {//上传成功之后 还原到最初状态的处理
//清除content
$(&.imgcontainer&).html(childs);
//隐藏进度条和关闭键
$(&.closespan,.infospan&).hide();
$(&.imguploadmessage&).html(&上传成功!&);
//禁止输入框和提交按钮
$('#Remark,#imgsubmit').attr(&disabled&, &disabled&);
//去掉data-count 属性 显示第一个;
$(&.uploadbox&).attr(&data-count&, 0).hide().eq(0).show();
$(&#Remark&).val(&&);
var stt = setTimeout(function () {
$(&#imgupload&).modal('hide');
$(&.imguploadmessage&).html(&&);
clearTimeout(stt);
$('#ImgForm').ajaxForm({//form插件来异步提交
beforeSend: function () {
imgbox.find(&.infospan&).show();//显示正在上传...
success: function (data) {
$(&#imgFlie&).val(&&);//
imgbox.find(&.imgcontainer&).html(data);//.hide()
var img = imgbox.find(&.imgcontainer&).find(&img&).attr(&src&);
if (img != undefined) {//返回的没有图片,表示上传的图片有问题。
$('#Remark').removeAttr(&disabled&);
$('#imgsubmit').removeAttr(&disabled&);
imgbox.find(&.infospan,.closespan&).show();
imgbox.find(&.infospan&).html(&上传成功!&);
//显示下一个
//imgbox.next().show();
$(&.uploadbox:hidden&).eq(0).show();
imgbox.attr(&data-count&, &1&);
imgbox.find(&.infospan,.closespan&).hide();// 结果栏和关闭继续隐藏 中间会显示错误信息。
// alert(img);
}, complete: function (xhr) {
$(&#imgFlie&).val(&&);
& 一共是五个函数:来处理 上传,删除图片,保存图片,检查图片和获取扩展名。 在这里我用了session来存储url,临时文件的地址和存入数据库的地址是不一样的。
&每张图片也重新命名了。
/// &summary&
/// 删除预览中的照片
/// &/summary&
/// &param name=&str&&这个str 已经是处理过的,不是之前上传的图片名称&/param&
public void DeleteImg(string str)
//删除地址 删除文件
var list = Session[&Imgscr&] as List&string&;
if (list == null) return;
var index = list.IndexOf(str);
var slist = Session[&ImgServerscr&] as List&string&;
if (slist != null && index != -1)
var imgone = slist[index];
if (imgone != null)
var img = new FileInfo(imgone);
if (img.Exists) img.Delete();
list.Remove(str);
private string CheckImg(HttpPostedFileBase file)
if (file == null) return &图片不能空!&;
if (file.ContentLength / 1024 & 8000)
return &图片太大&;
if (file.ContentLength / 1024 & 10)
return &图片太小!&;
var image = GetExtensionName(file.FileName).ToLower();
if (image != &.bmp& && image != &.png& && image != &.gif& && image != &.jpg& && image != &.jpeg&)// 这里你自己加入其他图片格式,最好全部转化为大写再判断,我就偷懒了
return &格式不对&;
var scrtemp = bine(&../../Content/TempFile/&, file.FileName);//图片展示的地址
var list = Session[&Imgscr&] as List&string&;
if (list != null && list.Find(n =& n == scrtemp) != null)
return &同样的照片已经存在!&;
return &ok&;
public JsonResult SaveImgs(string content)
var uid = CheckValid();//获取id
if (_uName == null) _uName = GetUserNameById(uid);
string path = bine(HttpContext.Server.MapPath(&../Content/UploadFiles/&), _uName, &Photos&, &ImgBox&);
if (!Directory.Exists(path))
Directory.CreateDirectory(path);
var list = Session[&Imgscr&] as List&string&;
var finallist = new List&string&();
if (list == null) return Json(0);
foreach (var str in list)
var scrtemp1 = Server.MapPath(str.Substring(3, str.Length - 3));//去掉第一个../
var img = new FileInfo(scrtemp1);
if (img.Exists)
var image = GetExtensionName(img.Name);
//处理照片名称
var imgname = string.Format(&{0:yyyMMdd}&, DateTime.Now).Replace(&/&, &&) + DateTime.Now.Ticks.ToString(CultureInfo.InvariantCulture).Substring(7, 11) +
var scrdestination = bine(HttpContext.Server.MapPath(&../Content/UploadFiles/&), _uName, &Photos&, &ImgBox&, imgname);
var scrshow = bine((&../../Content/UploadFiles/&), _uName, &Photos&, &ImgBox&, imgname);
finallist.Add(scrshow);
//移动照片
img.MoveTo(scrdestination);
//存入imgbox
var box = new Iamgbox
ActionTime = DateTime.Now,
BoxName = _uName,
ImgUrl = scrshow,
IsValid = true, //默认是正规合适的图片 不合适在检举
PraiseCount = 0,
Remark = content,
UserId = uid,
VisitCount = 0,
LoveDb.Add(box);
if (finallist.Count() != 0)
var sbstr = new StringBuilder(&&br/&&div class='imgtigger'&&);
foreach (var str in finallist)
sbstr.Append(&&img src='& + str + &' /&&);
sbstr.Append(&&/div&&);
var state = new State
ActionTime = DateTime.Now,
Content = (content == && ? string.Format(&刚刚上传了{0}张照片:&, finallist.Count) : content)+sbstr,
PraiseCount = 0,
StateType = StateType.Image.ToString(),
UserId = uid
LoveDb.Add(state);
Session.Remove(&Imgscr&);
Session.Remove(&ImgServerscr&);
return Json(1);
public string GetExtensionName(string fileName)
if (fileName.LastIndexOf(&\\&, StringComparison.Ordinal) & -1)//在不同浏览器下,filename有时候指的是文件名,有时候指的是全路径,所有这里要要统一。
fileName = fileName.Substring(fileName.LastIndexOf(&\\&, StringComparison.Ordinal) + 1);//IndexOf 有时候会受到特殊字符的影响而判断错误。加上这个就纠正了。
return Path.GetExtension(fileName.ToLower());
这样 整个图片上传就完成了。希望对你有帮助!& &
已发表评论数()
请填写推刊名
描述不能大于100个字符!
权限设置: 公开
仅自己可见
正文不准确
标题不准确
排版有问题
主题不准确
没有分页内容
图片无法显示
视频无法显示
与原文不一致插件描述:样式非常美观,并且支持上传文件预览,ajax同步或异步上传,拖曳文件上传等炫酷的功能,完全没有理由不去使用
file input插件功能如此强大,样式非常美观,并且支持上传文件预览,ajax同步或异步上传,拖曳文件上传等炫酷的功能,完全没有理由不去使用,但是国内很少能找到本插件完整的使用方法,于是本人去其官网翻译了一下英文说明文档放在这里供英文不好的同学勉强查阅。另外附上一段调用方发和servlet端的接收代码,未完待续。引言:一个强化的HTML5 文件输入插件,适用于Bootstrap 3.x。本插件对多种类型的文件提供文件预览,并且提供了多选等功能。本插件还提供给你一个简单的方式去安装一个先进的文件选择/上传控制版本去配合Bootstrap CSS3样式。通过对很多种文件提供预览支持,比如图片,文本,html,视频,声音,flash和对象,它大大增强了文件输入的功能。另外,它还包含基于AJAX的上传,拖拽,移除文件的功能,可视化的上传进度条,和可选择的添加或删除文件预览功能。提示:本插件致力于使用大量在添加jquery下的css3和html5功能,强调:你可能会发现css3或html5或它两个的混合在许多实现中被需要。本插件最早受一篇博文和Jasny'sFile Input plugin启发。但是本插件现在已经添加的好多功能和强化,为开发者提供了一个成熟并且完整的文件管理工具和解决方案。伴随着4.0.0版本的发布,本插件现在支持被多种现代化浏览器支持的,基于Ajax,利用html5 Formdata和XHR2协议的上传。而且她也拥有了对在服务器端基于AJAX的文件删除原生内置支持。因此它可以添加更加强大的功能,联机添加、移除文件。本插件也对大多数现代浏览器添加了拖拉,移除支持。它也已经为Ajax上传提供原生支持。万一,浏览器不支持FormData或XHR2,本插件会降级成一个普通表单。&文件上传插件File Input介绍一般情况下,我们需要引入下面两个文件,插件才能正常使用:bootstrap-fileinput/css/fileinput.min.css
bootstrap-fileinput/js/fileinput.min.js简单的界面效果和众多上传文件控件一样,可以接受各种类型的文件。当然,我们也可以指定具体接受的文件类型等功能。如果需要考虑中文化,那么还需要引入文件:bootstrap-fileinput/js/fileinput_locale_zh.js这样基于MVC的Bundles集合,我们把它们所需要的文件加入到集合里面即可。//添加对bootstrap-fileinput控件的支持
css_metronic.Include(&~/Content/MyPlugins/bootstrap-fileinput/css/fileinput.min.css&);
js_metronic.Include(&~/Content/MyPlugins/bootstrap-fileinput/js/fileinput.min.js&);
js_metronic.Include(&~/Content/MyPlugins/bootstrap-fileinput/js/fileinput_locale_zh.js&);这样我们在页面里面,就可以呈现出中文的界面说明和提示了文件上传插件File Input的使用一般情况下,我们可以定义一个JS的通用函数,用来初始化这个插件控件的,如下JS的函数代码所示。//初始化fileinput控件(第一次初始化)
function&initFileInput(ctrlName,&uploadUrl)&{&&&&
&&&&var&control&=&$('#'&+&ctrlName);&
&&&&control.fileinput({
&&&&&&&&language:&'zh',&//设置语言
&&&&&&&&uploadUrl:&uploadUrl,&//上传的地址
&&&&&&&&allowedFileExtensions&:&['jpg',&'png','gif'],//接收的文件后缀
&&&&&&&&showUpload:&false,&//是否显示上传按钮
&&&&&&&&showCaption:&false,//是否显示标题
&&&&&&&&browseClass:&&btn&btn-primary&,&//按钮样式&&&&&&&&&&&&&
&&&&&&&&previewFileIcon:&&&i&class='glyphicon&glyphicon-king'&&/i&&,&
}页面代码里面,我们放置一个文件上传控件,如下代码所示。&div&class=&row&&style=&height:&500px&&
&input&id=&file-Portrait1&&type=&file&&
&/div&这样我们脚本代码的初始化代码如下://初始化fileinput控件(第一次初始化)
initFileInput(&file-Portrait&,&&/User/EditPortrait&);这样就完成了控件的初始化了,如果我们需要上传文件,那么还需要JS的代码处理客户端上传的事件,同时也需要MVC后台控制器处理文件的保存操作。例如我对窗体数据的保存处理代码如下所示。//添加记录的窗体处理
&&&&&&&&&&&&formValidate(&ffAdd&,&function&(form)&{
&&&&&&&&&&&&&&&&$(&#add&).modal(&hide&);
&&&&&&&&&&&&&&&&//构造参数发送给后台
&&&&&&&&&&&&&&&&var&postData&=&$(&#ffAdd&).serializeArray();
&&&&&&&&&&&&&&&&$.post(url,&postData,&function&(json)&{
&&&&&&&&&&&&&&&&&&&&var&data&=&$.parseJSON(json);
&&&&&&&&&&&&&&&&&&&&if&(data.Success)&{
&&&&&&&&&&&&&&&&&&&&&&&&//增加肖像的上传处理
&&&&&&&&&&&&&&&&&&&&&&&&initPortrait(data.Data1);//使用写入的ID进行更新
&&&&&&&&&&&&&&&&&&&&&&&&$('#file-Portrait').fileinput('upload');
&&&&&&&&&&&&&&&&&&&&&&&&//保存成功&&1.关闭弹出层,2.刷新表格数据
&&&&&&&&&&&&&&&&&&&&&&&&showTips(&保存成功&);
&&&&&&&&&&&&&&&&&&&&&&&&Refresh();
&&&&&&&&&&&&&&&&&&&&}
&&&&&&&&&&&&&&&&&&&&else&{
&&&&&&&&&&&&&&&&&&&&&&&&showError(&保存失败:&&+&data.ErrorMessage,&3000);
&&&&&&&&&&&&&&&&&&&&}
&&&&&&&&&&&&&&&&}).error(function&()&{
&&&&&&&&&&&&&&&&&&&&showTips(&您未被授权使用该功能,请联系管理员进行处理。&);
&&&&&&&&&&&&&&&&});
&&&&&&&&&&&&});其中我们注意到文件保存的处理逻辑代码部分://增加肖像的上传处理
initPortrait(data.Data1);//使用写入的ID进行更新
$('#file-Portrait').fileinput('upload');第一行代码就是重新构建上传的附加内容,如用户的ID信息等,这样我们就可以根据这些ID来构建一些额外的数据给后台上传处理了。这个函数主要就是重新给ID赋值,方便上传的时候,获取最新的附加参数,这个和Uploadify的处理模式一样的。//初始化图像信息
&&&&&&&&function&initPortrait(ctrlName,&id)&{
&&&&&&&&&&&&var&control&=&$('#'&+&ctrlName);
&&&&&&&&&&&&var&imageurl&=&'/PictureAlbum/GetPortrait?id='&+&id&+&'&r='&+&Math.random();
&&&&&&&&&&&&//重要,需要更新控件的附加参数内容,以及图片初始化显示
&&&&&&&&&&&&control.fileinput('refresh',&{
&&&&&&&&&&&&&&&&uploadExtraData:&{&id:&id&},
&&&&&&&&&&&&&&&&initialPreview:&[&//预览图片的设置
&&&&&&&&&&&&&&&&&&&&&&img&src='&&+&imageurl&+&&'&class='file-preview-image'&alt='肖像图片'&title='肖像图片'&&,
&&&&&&&&&&&&&&&&],
&&&&&&&&&&&&});
&&&&&&&&}前面我们看到,我上传的地址为:&/User/EditPortrait&,这个后台的函数我也公布一下,希望给大家一个完整的案例代码学习。///&&summary&
&&&&&&&&///&上传用户头像图片
&&&&&&&&///&&/summary&
&&&&&&&&///&&param&name=&id&&用户的ID&/param&
&&&&&&&&///&&returns&&/returns&
&&&&&&&&public&ActionResult&EditPortrait(int&id)
&&&&&&&&&&&&CommonResult&result&=&new&CommonResult();
&&&&&&&&&&&&try
&&&&&&&&&&&&{
&&&&&&&&&&&&&&&&var&files&=&Request.F
&&&&&&&&&&&&&&&&if&(files&!=&null&&&&files.Count&&&0)
&&&&&&&&&&&&&&&&{
&&&&&&&&&&&&&&&&&&&&UserInfo&info&=&BLLFactory&User&.Instance.FindByID(id);
&&&&&&&&&&&&&&&&&&&&if&(info&!=&null)
&&&&&&&&&&&&&&&&&&&&{
&&&&&&&&&&&&&&&&&&&&&&&&var&fileData&=&ReadFileBytes(files[0]);
&&&&&&&&&&&&&&&&&&&&&&&&result.Success&=&BLLFactory&User&.Instance.UpdatePersonImageBytes(UserImageType.个人肖像,&id,&fileData);
&&&&&&&&&&&&&&&&&&&&}
&&&&&&&&&&&&&&&&}
&&&&&&&&&&&&}
&&&&&&&&&&&&catch&(Exception&ex)
&&&&&&&&&&&&{
&&&&&&&&&&&&&&&&result.ErrorMessage&=&ex.M
&&&&&&&&&&&&}
&&&&&&&&&&&&return&ToJsonContent(result);
&&&&&&&&}这样我们就构建了上面的用户肖像的保存处理逻辑了,文件可以正常的保存到后台的文件系统里面,同时数据库里面记录一些必备的信息。当然,除了用来处理用户的肖像图片,我们也可以用来构建图片相册的处理操作的。//初始化fileinput控件(第一次初始化)
&&&&&&&&&&&&$('#file-Portrait').fileinput({
&&&&&&&&&&&&&&&&language:&'zh',&//设置语言
&&&&&&&&&&&&&&&&uploadUrl:&&/FileUpload/Upload&,&//上传的地址
&&&&&&&&&&&&&&&&allowedFileExtensions&:&['jpg',&'png','gif'],//接收的文件后缀,
&&&&&&&&&&&&&&&&maxFileCount:&100,
&&&&&&&&&&&&&&&&enctype:&'multipart/form-data',
&&&&&&&&&&&&&&&&showUpload:&true,&//是否显示上传按钮
&&&&&&&&&&&&&&&&showCaption:&false,//是否显示标题
&&&&&&&&&&&&&&&&browseClass:&&btn&btn-primary&,&//按钮样式&&&&&&&&&&&&&
&&&&&&&&&&&&&&&&previewFileIcon:&&&i&class='glyphicon&glyphicon-king'&&/i&&,&
&&&&&&&&&&&&&&&&msgFilesTooMany:&&选择上传的文件数量({n})&超过允许的最大数值{m}!&,
&&&&&&&&&&&&});
相关插件-上传
讨论这个项目(44)回答他人问题或分享插件使用方法奖励jQ币
我和小伙伴们。0
我一拖文件进去 浏览器就卡死了 试了好多次都是这样 &是不是这个插件有问题。
什么浏览器呢?
犯二青年的Le趣0
请问下这个是怎么设置用户只能一次最多上传数量的
????????????D°0
同问,请问你解决这个问题了吗
最近发现一个新的方法 就是可以监听在文件上传成功的事件 &$(&#file-1&).on(&filebatchuploadsuccess&,&function(event,&data,&previewId,&index)&{
&&//上传成功的一系列操作&,&&比如一些&刷新图片列表
我试了不起作用。。。55
使用refresh后不能同时上传多张图片呢?没传都只上传了一张,求解救
那个 图片 上传 选择 删除的图片在哪里 第一次用还不会用 下载插件之后 img中只有两张图片 刷新和加载的图片?
wenshangang0
设置了language: 'zh' &导了fileinput_locale_zh.js &还是英文的 &是什么情况?不会用……求教
新版的官方中文好像不好使,我直接把汉化覆盖进核心文件成功了
ソi沏?lè?0
您好,我这边图片上传成功了,但是页面出现了upload error &xxx.jpg[object object]的错误提示。如何解决呢,谢谢了!
后台返回json字符串 &绑定uploaded事件处理返回数据
IOS版微信内置浏览器上选择视频文件的时候,提示文件未找到,如果选择图片没有问题。在安卓版测试一切正常。
Sunny.Zhang0
如果下次能将先后端的完整代码打包给出来就好了!
我这边遇到问题是语言包格式引起的,语言包格式$.fn.fileinputLocales['zh']而不是$.fn.fileinput.Locales.zh
提示“文件上传数量必须大于2个文件”这个参数是在哪儿设置的?急急急!
有官方的文档的 , 百度搜索 bootstrap - fileinput 就可以了&
提示“文件上传数量必须大于2个文件”这个参数是在哪儿设置的?有没有详细的API啊,愁死啦,求各位大神帮忙啊!!!!
minFileCount: 5
?ōべ学?爱?.90
用户上传图片后把图片保存下来下一次他再打开的时候可以看见上次上传的图片呢?有这个方法吗?
默认就是这样的 , 再打开没有之前的图片也就是掉一遍 clear 方法吧 貌似
顶。 下载不要JQB 支持了
我问一下,上传文件格式错误的时候,为什么删除的按钮没有效果
有没有API文档,好多功能都得去看代码一步一步分析这个参数什么用
想要什么功能, 一般就看看 他闭包暴露出来的有哪些方法 , 如果有些方法的实现不符合你的要求,自己改源码也是没有问题的
。。为什么隐藏预览图 没有效果T T
这貌似是德语旧版的,新版中文有人弄成功了么?我之前折腾半天汉化都不成功,最后把汉化文件直接覆盖到核心文件里实现了、、、
没有把 , 不是自带汉化的吗
对于 汉化不成功这些问题 , 大家可以直接去更改源码 ,或者去查查什么原因 &,最近换了工作 比较忙&
官方网站上的一些 常用事件&
插上翅膀的梦0
能否提供完整点的demo呢?&& 添加记录的窗体处理这里的代码始终没有看懂呢!
fileclearfileclearedfileresetfileerrorfileuploaderrorfilebatchuploaderrorfiledeleteerrorfilefoldererrorfilecustomerrorfileuploadedfilebatchuploadcompletefilebatchuploadsuccess
官网地址,已经加到上面去了。
zhuimeng57670
请问上传成功后,需要返回什么样的数据,数据中需要什么的内容?我用插件上传文件到腾讯云存储,文件上传成功,可是fileinput无法得到返回数据。
/tp失音 Moment°0
我是用在文章上面的,上传的时候没有问题了,但是点击编辑的时候怎么让他显示默认的图片呢?
我用批量拖拽上传成功了 , 但是我不想要& 单个图片上的upload& 按钮,删了半天删不掉& ,代码如下$(&#file-5&).fileinput({
&&&&overwriteInitial:&true,
&&&&maxFileSize:&1500,
&&&&showClose:&false,
&&&&showCaption:&false,
&&&&showUpload:&true,
&&&&uploadAsync:&false,
&&&&showBrowse:&false,
&&&&browseOnZoneClick:&true,
&&&&showCancel:&true,
&&&&removeLabel:&'',
&&&&allowedFileTypes:&['image'],
&&&&removeIcon:&'&i&class=&glyphicon&glyphicon-remove&&&/i&',
&&&&removeTitle:&'Cancel&or&reset&changes',
&&&&elErrorContainer:&'#kv-avatar-errors-2',
&&&&msgErrorClass:&'alert&alert-block&alert-danger',
&&&&defaultPreviewContent:&'&img&src=&&%=basePath%&images/nopic.png&&alt=&Your&Avatar&&style=&width:160px&&&h6&class=&text-muted&&Click&to&select&/h6&',
&&&&layoutTemplates:&{
&&&&&&&&main2:&'{preview}{remove}&{browse}'
&&&&allowedFileExtensions:&[&jpg&,&&png&]
})&div&class&=&&form-group&&&&
&input&id&=&&file-5&name&=&&colourImages&class&=&&file&type&=&&file&multiple&data&-&preview&-&file&-&type&=&&any&data&-&upload&-&url&=&&#&data&-&preview&-&file&-&icon&=&&&&&
&/div&这是js 和html,我用表单提交不需要单个上传按钮,求教 怎么才能去的掉?
&showUpload:&true,这句话改成false
jquery_tiger0
页面加载初始化fileinput 了,如何在保存完表单通过返回的id,向fileinput&uploadExtraData这个参数传入值 用control.fileinput('refresh',&{
&&&&uploadExtraData:&params,
&&&&/*&initialPreview:&[&//预览图片的设置&&img&src='&&+&imageurl&+&&'&class='file-preview-image'&alt='肖像图片'&title='肖像图片'&&,],&*/
});是能够动态传入参数但没法回调。是不是函数写的位置不对?
火狐浏览器拖拽文件后悔自动打开文件或者下载如何解决?
难以深拥。0
执行完的回调方法是什么, 求告知
怎么显示VIEW,弹框独立预览的
上传之后点击缩略图上的删除按钮,为啥不执行后台的删除文件的方法,我加的是deleteURL,求解
PéiGǔangTíng0
我知道 删除的方法 但是我想知道 执行完删除 请求后台之后 回调的值
PéiGǔangTíng0
我想知道 删除之后 后台怎么回调一个 函数过来 &还有就是 点击删除的id在哪 求大神啊 & qq
PROMULGATOR
关注作者 (9)
收藏此插件 (38)
我当前jQ币余额:正在获取..
已下载次数:2555
所需jQ币:0}

我要回帖

更多关于 java上传图片 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信