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 ...
随机推荐
- Vue学习笔记(20190722)
- ORACLE数据库实现自增的两种方式
Mysql数据库因为其有自动+1,故一般我们不需要花费太多时间,直接用关键字auto_increment即可,但是Oracle不行,它没有自动增长机制.顾我们需要自己去实现.一般有两种方式,但是这两种 ...
- python pip 切换阿里云镜像
示例: pip install xxx -i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com
- 【洛谷 P3804】 【模板】后缀自动机
题目链接 #include <cstdio> #include <cstring> #include <algorithm> using namespace std ...
- 阿里企业邮箱smtp设置
阿里的邮箱没有SMTP授权码信息 SMTP服务器:smtp.mxhichina.com
- Python学习日记(二) list操作
l = ['a','b','c','d',1,2,[3,'e',4]] 1.list.append() 在list的结尾新增一个新的元素,没有返回值,但会修改原列表 l.append(5) print ...
- 【转】高性能网络编程3----TCP消息的接收
这篇文章将试图说明应用程序如何接收网络上发送过来的TCP消息流,由于篇幅所限,暂时忽略ACK报文的回复和接收窗口的滑动. 为了快速掌握本文所要表达的思想,我们可以带着以下问题阅读: 1.应用程序调用r ...
- k8s集群之上运行etcd集群
一.知识点: 1.headless services NOTE:: 我们在k8s上运行etcd集群,集群间通告身份是使用dns,不能使用pod ip,因为如果pod被重构了ip会变,在这种场景中不能直 ...
- 华为云PaaS首席科学家:Cloud Native +AI,企业数字化转型的最佳拍档
近日,在2019华为全球分析师大会期间,华为云PaaS首席科学家熊英博士在+智能,见未来(华为云&大数据)的分论坛上,从云计算行业发展谈起,深入云原生发展趋势,对华为云智能应用平台做了深度解读 ...
- IDEA实用教程(六)—— 全局设置的两种方式
五. 全局设置的两种方式 在启动界面进入全局设置 在编码界面进入全局设置 本项目配置 上面的这种设置仅对本项目生效,不会对其他项目生效.请特别注意!!!