layui中删除数组中的某张图

html部分

 <div class="layui-form-item">
                    <label class="layui-form-label" style="width: 200px;margin-left: -120px">image for shopping</label>
                    <div class="layui-input-block">
                        <input id="pic" name="pic" type="hidden"  class="layui-input"/>
                        <button type="button"  class="layui-btn layui-btn-sm" id="picBtn"><i class="layui-icon"></i>选择图片
                        </button> &nbsp;&nbsp;&nbsp;Tips:click the image to delete
                        <div class="layui-upload-list" id="img1" style="display: flex;flex-wrap: wrap;">
                        </div>
                    </div>
                </div>

js部分

   var token = Cookies.get('uds_token');
 
 
 
//普通图片上传
upload.render({
    elem: '#picBtn'
    ,multiple: false
    , url: '/uds/sourcing/uploadImg'
    , before: function (obj) {
        obj.preview(function (index, file, result) {
            //console.log("result:",result)
            //$('#img1').append('src', result);
            if(imageNameArr.length==3){
                layer.msg("最多上传三张图片！！！")
                return
            }
            //$('#img1').append('<div id="img2" onclick="deleteImage('+21+')"><img  class="layui-upload-img" src="'+result+'"  width="92px" height="92px"></div>');
        });
    }
    ,data:{
        token:token
    }
    , done: function (res) {
 
         if(imageNameArr.length==3){
             //layer.msg("最多上传三张图片！！！")
             return
         }
        // $('#img1').append('<div onclick="deleteImage('+res.data.url+')"><img  class="layui-upload-img" src="'+res.data.url+'"  width="92px" height="92px"></div>');
        layer.msg("上传成功！")
        console.log("res:",res)
        var imageUrlName =  res.data.url
        var imageUrl = domainName + imageUrlName;
        imageNameArr.push(imageUrlName)
        //console.log(imageNameArr)
        console.log(imageUrlName)
        //var number = "dad";
        $('#img1').append("<div id='img2' style='margin-right: 2px' onclick='deleteImage(\""+imageUrlName+"\")'><img  class='layui-upload-img' src="+imageUrl+"  width='92px' height='92px'></div>");
        //layer.open({content:"上传图片成功！"});
    }
    , error: function (res) {
        //
        layer.msg("上传图片失败！")
 
        console.log(res)
    }
});
 
//删除图片
window.deleteImage = function (imageUrlName){
    console.log("imageUrlName:",imageUrlName)
    $('#img2').remove();
    for (var i=0;i<imageNameArr.length;i++){
        if (imageNameArr[i]==imageUrlName){
            imageNameArr.splice(i,1);
        }
    }
    //console.log("imageNameArr:",imageNameArr)
    // for(var j=0;j<imageNameArr.length;j++){
    //     var imageUrl = 'http://api.uds.com/'+imageNameArr[j];
    //     $('#img1').append("<div id='img2' onclick='deleteImage(\""+imageNameArr[j]+"\")'><img  class='layui-upload-img' src="+imageUrl+"  width='92px' height='92px'></div>");
    // }
 
}

关注我的公众号SpaceObj 领取idea系列激活码