使用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重复上传图片失效的问题的更多相关文章

  1. JQuery input file 上传图片

    表单元素file设置隐藏,通过其他元素打开: .imgfile为input file $(".ul").click(function () {return $(".img ...

  2. input标签上传图片怎么获取src;

    大家都知道input标签可以上传文件 如: <input type="file"/> 就可以上传文件,当然也可以上传图片,上传的图片的src地址如何取到: var re ...

  3. input file 上传图片问题

    html代码如下: <input id="fileup" type="file" accept="image/*" capture=& ...

  4. 改变bootstrap-wysiwyg样式(如hide()show()等),上传图片失效

    最近在试验bootstrap-wysiwyg鱼easyui的整合,两者的兼容性,可以说是基本不兼容... 但是由于需求摆在那里,再大的困难也得克服. 比如像是将bootstrap-wysiwyg放入e ...

  5. html5手机 input file 上传图片 调用API

    <input type="file" accept="video/*;capture=camcorder"> <input type=&quo ...

  6. (转)html中使用表单和input file上传图片

    本文转载自:http://hi.baidu.com/love_1210/item/120e452b42b2a854c38d59eb 客户端代码: <form name="form1&q ...

  7. input file上传图片预览,非插件

    Input标签 <input type="file" name="pic" onchange="changepic(this)" mu ...

  8. 微信小程序 input使用letter-spacing失效问题

    根据ui设计稿, 本来思路是一个input搞定,下面的线使用背景图 background:url('/images/line.png')no-repeat bottom center; 然后使用let ...

  9. H5 使用input标签上传图片给后台

    html代码: <div class="hpk-showimg"> <!-- 营业执照 --> <div class="idcardup&q ...

随机推荐

  1. Oracle数据库常用语法

    基本 --新建表:create table table1( id varchar(300) primary key, name varchar(200) not null); --插入数据 inser ...

  2. delphi indy Idhttp error:1409442E:SSL routines:SSL3_READ_BYTES:tlsv1 alert protocol version

    在使用 indy 中的 idhttp 组件访问 https 网站时,出现如下错误: error:1409442E:SSL routines:SSL3_READ_BYTES:tlsv1 alert pr ...

  3. 实现负载均衡的小demo

    首先我们先来了解负载均衡: 负载均衡是为了缓解网络压力的,服务器端进行扩容的重要手段 实现有两种方式:硬件F5    .   软件nginx.Dubbo 为了实现负载均衡的原理,我们基于以下两篇随笔继 ...

  4. JQ分页的使用

    <script src="../js/pageMe.js"></script> <script src="../js/comjq.js&qu ...

  5. HTML5新增元素和移除的元素?

    新增元素: 图像Canvas 多媒体video.audio 本地存储localStorage.sessionStorage 语义化更好的内容元素aticle.header.footer.nav.sec ...

  6. ORM 查询练习

    目录 ORM 查询练习 表结构 练习题 测试数据 准备 参考答案 ORM 查询练习 表结构 # 书 class Book(models.Model): title = models.CharField ...

  7. iPhone 移植到 iPad:

    来源:http://www.wapera.cn/ipadkaifa/71354.html iPhone移植到iPad: 方法一修改设备目标设置(普通模式:一套代码及XIB界面文件,代码分if和else ...

  8. react-router-dom下的BrowserRouter和HashRouter

    奇思妙想的

  9. 【转】关于TCP/IP,必须知道的十个知识点

    本文整理了一些TCP/IP协议簇中需要必知必会的十大问题,既是面试高频问题,又是程序员必备基础素养. 一.TCP/IP模型 TCP/IP协议模型(Transmission Control Protoc ...

  10. WebForm SignalR 实时消息推送

    原文:https://www.jianshu.com/p/ae25d0d77011 官方文档:https://docs.microsoft.com/zh-cn/aspnet/signalr/ 实现效果 ...