上传图片 html 交互

点击更改图片上传图片

<iframe name="edit" style="display: none;"></iframe>

<form action="" name="myform" method="post" target="edit" enctype="multipart/form-data" style="display: none;">
<!--*.jpeg,*.jpg的accept属性值均是jpeg-->
<input type="file" accept="image/jpeg,image/png" name="UploadForm[file]" id="editImg"/>
<input type="hidden" name="img"  value="1" />
</form>

<label for="editImg" class="editPic">更改图片</label>

var base_shops_album = null;

 base_shops_album = function(s){  //s是后台返回的数据
        var src = s.url,thisId = s.src_id;                    
        layer.closeAll();  
        $(".color-content li[data-id="+thisId+"]").find(".layui-upload-img").attr('src',src);
        $("#editImg").val("");  //上传后需要情况value 否则不可上传同一图片
        layer.msg("更改成功") 
    }

//更改图片
        var label = null;

        $("#editImg").on('change',function(){

         //$(label)就是$(".editPic)

document.myform.action='<?php echo Url::to(['/admin/upload/multiple-img']);?>&pid='+src_id+'&shop_id='+shop_id+'&fname=base_shops_album&field=img';   //后台给的地址    带相应的参数 回调函数要带 
    document.myform.submit();
        })
        $("body").on('click',".editPic",function(){
    label = this;
    })