input重复上传图片失效的问题
使用input的file来上传图片 如果是重复选择相同的图片就会失效
解决的办法就是当每次上传完图片后让input的值为空就可以解决了 附上代码 只需在末尾添加这句就行$(this).val("");
// 上传企业环境
$("#upfile-hj").change(function (e) {
var files = this.files;
var length = files.length;
if (length > 6 || length + $('.img-hj').children('div').length > 6) {
alert('最多选择6张图片')
return false
}
for (var i = 0; i < length; i++) {
if (!/image\/\w+/.test(files[i].type)) {
alert("您上传的图片有误 请重新上传");
return false;
}
var fr = new FileReader(),
div = document.createElement("div"),
img = document.createElement("img");
div.className = 'pic';
fr.onload = function (e) {
var html_img = '<div style="display:inline-block;position: relative;"><img class="qyhj" src="' + this.result + '" alt=""><img class="xx" src="../public/images/ic_Close_ .png" alt=""></div>'
$('.img-hj').append(html_img)
if ($('.img-hj').children('div').length == 6) {
$('.file-img .img-hjbtn').hide()
}
}
fr.readAsDataURL(files[i]);//读取文件
}
$(this).val(""); //上传完图片后让input值为空
});
input重复上传图片失效的问题的更多相关文章
- JQuery input file 上传图片
表单元素file设置隐藏,通过其他元素打开: .imgfile为input file $(".ul").click(function () {return $(".img ...
- input标签上传图片怎么获取src;
大家都知道input标签可以上传文件 如: <input type="file"/> 就可以上传文件,当然也可以上传图片,上传的图片的src地址如何取到: var re ...
- input file 上传图片问题
html代码如下: <input id="fileup" type="file" accept="image/*" capture=& ...
- 改变bootstrap-wysiwyg样式(如hide()show()等),上传图片失效
最近在试验bootstrap-wysiwyg鱼easyui的整合,两者的兼容性,可以说是基本不兼容... 但是由于需求摆在那里,再大的困难也得克服. 比如像是将bootstrap-wysiwyg放入e ...
- html5手机 input file 上传图片 调用API
<input type="file" accept="video/*;capture=camcorder"> <input type=&quo ...
- (转)html中使用表单和input file上传图片
本文转载自:http://hi.baidu.com/love_1210/item/120e452b42b2a854c38d59eb 客户端代码: <form name="form1&q ...
- input file上传图片预览,非插件
Input标签 <input type="file" name="pic" onchange="changepic(this)" mu ...
- 微信小程序 input使用letter-spacing失效问题
根据ui设计稿, 本来思路是一个input搞定,下面的线使用背景图 background:url('/images/line.png')no-repeat bottom center; 然后使用let ...
- H5 使用input标签上传图片给后台
html代码: <div class="hpk-showimg"> <!-- 营业执照 --> <div class="idcardup&q ...
随机推荐
- SpringCloud之Zuul网关简介、映射vs过滤配置使用
目的: Zuul路由网关简介及基本使用 Zuul路由映射配置 Zuul请求过滤配置 Zuul路由网关简介及基本使用 Zuul简介: Zuul是从设备和网站到Netflix流应用程序后端的所有请求的前门 ...
- Codeforces 1239B. The World Is Just a Programming Task (Hard Version)
传送门 这一题好妙啊 首先把括号序列转化成平面直角坐标系 $xOy$ 上的折线,初始时折线从坐标系原点 $(0,0)$ 出发 如果第 $i$ 个位置是 '(' 那么折线就往上走一步($y+1$),否则 ...
- k8s yaml格式的pod定义文件完整内容
apiVersion: v1 #必选,版本号,例如v1,版本号必须可以用 kubectl api-versions 查询到 . kind: Pod #必选,Pod metadata: #必选,元数据 ...
- docker 入坑3
查看镜像 docker images [OPTIONS] [REPOSITORY[:TAG]] -a, --all=false -f, --filter=[] --no-trunc=false -q, ...
- IIS配置文件的XML格式不正确 applicationHost.config崩溃
错误提示如图: 检查C:\Windows\System32\inetsrv\config目录下的applicationHost.config文件,备份一份. 可使用IIS提供的AppCmd.exe的r ...
- ABP 基于DDD的.NET开发框架 学习(七)继承不同的service直接调用api的区别
1.IApplicationService->IBaseService->具体IXXXService 具体XXXService->BaseService,具体IXXXService ...
- apache-httpd代理请求,selinux造成503问题的解决方法
NameVirtualHost *:80 <VirtualHost *:80> ServerName test.baidu.com ProxyPreserveHost on ProxyPa ...
- UCOSIII内建消息队列
使能内建消息队列 将OS_CFG_TASK_Q_EN置1 API函数 #if OS_CFG_TASK_Q_EN > 0u //删除 OS_MSG_QTY OSTaskQFlush (OS_TCB ...
- UCOS内存管理
STM32F10xxx内置64K字节的静态SRAM.它可以以字节.半字(16位)或全字(32位)访问 SRAM的起始地址是0x20000000 UCOSII //定义存储区 OS_MEM *DATA_ ...
- 解决远程连接数据库:Host is not allowed to connect to this MySQL server
远程连接数据时,报以下提示: Host 'web1' is not allowed to connect to this MySQL server 原因是数据库服务不允许远程登录,没有授权导致,解决方 ...