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 ...
随机推荐
- python之生成器yeild
python生成器Generator——yield 思考: 首先思考这样一个问题: 创建一个列表,但是内存受限,容量一定是有限的.那么如果创建了一个包含100万个元素的列表,不仅占用很大的存储空间,而 ...
- 数据建模工具------EZMNL
表结构设计器(EZDML) 表结构设计器EZDML1.5新版本发布,比以前介绍的1.2版本改进了很多,因此重新写了个介绍. 表结构设计,即所谓的数据建模,目前大家常用的同类著名工具有PowerDesi ...
- Java8 基础数据类型包装类-Long
https://blog.csdn.net/u012562117/article/details/79023440 基础 //final修饰不可更改,每次赋值都是新建类(其中-128~127是通过L ...
- CachedThreadPool
/** * <html> * <body> * <P> Copyright 1994 JsonInternational</p> * <p> ...
- 使用springboot实现一个简单的restful crud——02、dao层单元测试,测试从数据库取数据
接着上一篇,上一篇我们创建了项目.创建了实体类,以及创建了数据库数据.这一篇就写一下Dao层,以及对Dao层进行单元测试,看下能否成功操作数据库数据. Dao EmpDao package com.j ...
- 从MVC -> MVVM ? 开发模式
MVVM 到底是什么? view :由 MVC 中的 view 和 controller 组成,负责 UI 的展示,绑定 viewModel 中的属性,触发 viewModel 中的命令: viewM ...
- 用weexplus从0到1写一个app(2)-页面跳转和文章列表及文章详情的编写
说明 结束连续几天的加班,最近的项目终于告一段落,今天抽点时间开始继续写我这篇拖了很久的<用weexplus从0到1写一个app>系列文章.写这篇文章的时候,weexplus的作者已经把w ...
- jQuery将form表单的数据封装成json对象
/** * 自动将form表单封装成json对象 */ $.fn.serializeObject = function() { var o = {}; var a = this.serializeAr ...
- LAMP环境搭建之编译安装指南(php-5.3.27.tar.gz)
测试环境:CentOS release 6.5 (Final) 软件安装:httpd-2.2.27.tar.gz mysql-5.1.72.tar.gz php-5.3.27.tar.gz 1 ...
- 逗号分隔的字符串转成表格参与IN条件查询
返回值为'1,2,3,4,5,6,7',是一个字符串,如果要用IN 查询的话sql认为这是一个完整的字符串,需要将内容分隔转换变成table 定义函数如下: create Function sysfS ...