js中如何给一次上传的多张图片的右上角添加删除的图片及函数

Question

本来写的是一次上传多张图片，然后在每张图片的右上角放一个删除图标，现在问题是点击编辑的时候函数起作用，刚刚上传的图片删除时没作用，这是怎么回事啊？

 onUploadSuccess: function(file, data, response) {
             var proPath = $("#proImg").val();
             $("#proImg").val(data+";"+proPath);
             $("#path").val(data);
             $("#filepath").append("<img src=/stream?def=LOGO/default-pic.jpg&rel="+data+"/>");//刚刚上传的图片；
                var div = "<div id='"+proImgs+"' style='display: inline;'><img style='margin-left:1px;cursor:pointer; width: 16px;height: 16px;margin-bottom:50px;' src='/res/images/ico_clear.png' onclick='delimg(\""+proImgs+"\",\""+proPath+"\");'/></div>";//在刚刚上传图片的右上角放删除图标和函数；
            $("#filepath").append(div); 
          parent.showTipCom("#success","图片上传成功！",1000,"","");
                        }

HTML代码

 <td style="width:15%;height:80px;"><span>上传图片：</span></td>
                        <td>
                            <input type="hidden" id="proImg" name="proImg" value="${productInfo.proImg}">
                            <div id="proUploaddiv" style="height: 30px;width: 80px;float: left;margin-left: 5px;margin-top: 10px;" >
                                <input type="file" name="proImgs" id="proImgs" style="margin-top: 5px;width: 80px;height: 30px;line-height: 30px;text-align: center;color: #FFF;border: 0px ;display: block;font-size: 14px;cursor: pointer; background: url(/res4.0/image/upload.png) no-repeat center top；margin-right:-25px;"/>
                            </div>  
                        </td>
                        <td colspan="2" id="filepath">
                            <input type="hidden" id="path" name="path" value="" style="float:right;">
                            <c:forEach items='${productInfo.base64ProImgs}' var="item"  varStatus="status">
                            <div id="proImg${status.index}" style="display: inline;">
                                <img src="/stream/safe?rel=${item.proImg}"/><img style='margin-left:1px;cursor:pointer; width: 16px;height: 16px;margin-bottom:50px;' src='/res/images/ico_clear.png' onclick="delimg('proImg${status.index}','${item.proImg2}')" />
                            </div>
                            </c:forEach>
                        </td>

js代码：

 function delimg(id,img){
        var proPath = $("#proImg").val();
        proPath=proPath.replace(img+";","");
        $("#"+id).remove();
        $("#proImg").val(proPath);
    }

求大神指点

Answer 1

原因是由于，你一开始加载的时候给所有的图片加上删除，但是后面上传的图片，没有这个，由于js执行是对当时所有对象，而那时候，你的图片对象还没有上传，自然找不到，也就没有这个属性，按F12你查看属性就懂，
解决方案，每次加载新的图片的时候，在执行一次函数，（对函数进行修改，原先有移除属性的就不在添加）