zoukankan      html  css  js  c++  java
  • 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值为空
    });
    

      

  • 相关阅读:
    视频遮挡问题
    calc兼容性
    javascript变量声明提升
    jquery插件
    prop和attr在 jquery的
    onclick防止冒泡和json对象放入
    git 入门
    去掉ie滚动条兼容性
    单页面应用程序(SPA)
    swiper轮播图插件
  • 原文地址:https://www.cnblogs.com/xiechuanghong/p/9366664.html
Copyright © 2011-2022 走看看