使用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. (转)nginx与PHP的关系

    php是一门编程语言,可以编写很多程序,但是只有php的话,你的php只能在你的服务器里孤立的运行,比如你用php写了一个可以通过身高计算人的标准体重的程序,虽然这个程序可以在服务器运行,但是他还不能 ...

  2. C#解压、压缩高级用法

    压缩:(可以吧要排除的文件去掉) /// <summary> /// 压缩文件夹 /// </summary> /// <param name="folder& ...

  3. Web.sitemap网站导航

    全文注释: Web.sitemap导航XML文件,站点地图,功能实现菜单 1.xml的版本1.0 和编码utf-8 2.Url链接 Title显示的标题 Description描述(ToolTip) ...

  4. 并发编程之Disruptor并发框架

    一.什么是Disruptor Martin Fowler在自己网站上写了一篇LMAX架构的文章,在文章中他介绍了LMAX是一种新型零售金融交易平台,它能够以很低的延迟产生大量交易.这个系统是建立在JV ...

  5. datagridview控件 索引-1没有值

    很多WINFORM的开发人员在DataGridView的开发当中,都会出现“索引-1没有值”这个烦人的问题,其实较早之前,我已经大概知道问题的所在,也找到了解决方法,不过一直没有时间去深入研究一下,今 ...

  6. JavaScript_day02

    10.随机数 随机数一般和数组组合使用. 生成随机数:使用Math.random()函数,生成的随机数0-1.一般乘以10^n扩大随机数范围. Math.round()函数和parseInt()函数. ...

  7. 部署---Apache服务器安装SSL证书

    在云服务器的证书控制台下载Apache版本证书,下载到本地的是一个压缩文件. 解压后里面包含: _public.crt文件是证书文件, _chain.crt是证书链(中间证书)文件, .key文件是证 ...

  8. springboot 使用常用注解

    找到方法封装成json格式 @RestController = @Controller+@ResponseBody //一个组合注解,用于快捷配置启动类,springboot启动主入口 @Spring ...

  9. Java精通并发-锁粗化与锁消除技术实例演示与分析

    在上一次https://www.cnblogs.com/webor2006/p/11446473.html中对锁的升级进行了一个比较详细的理论化的学习,先回忆一下: 编译器对于锁的优化措施: 锁消除技 ...

  10. linux系统编程之信号(五)

    今天继续对信号进行学习,开始正入正题: sigaction函数: 安装信号之前我们已经学过一个函数:signal,它最早是在unix上出现的,它是对不可靠信号进行安装的,之后出现了可靠信号和实时信号, ...