Html上传图片，立即显示

    

 

<img src="" class="bg">
 <input type="file" accept="image/*" id="imagehead" value="" class="upload" />

 

<script type="text/javascript">
        
            var id=store.get("id");
            var UserId=store.get("UserId");
            $(".upload").on("change",function(){
                var objUrl = getObjectURL(this.files[0]);
                if(objUrl){
                    $(".picture img").show().attr("src",objUrl);
                    $(".picture span").hide();
                }
            })
            $(".add").click(function(){

                var apic=$(".picture img").attr("src");
                var pickname=$(".nickname input").val();
                var files = $('#imagehead').prop('files');

                 var fd = new FormData();
                        fd.append("UserId",UserId);
                        fd.append("file",files[0]);

                $.ajax({
                    type:"post",
                    url:turl+'/User/UpdateHeadImage',
                    data:fd,
                    processData:false,
                    success:function(res){
                        console.log(res);
                        if(res.code=="0"){

                        }else{
                            //BW.Toast(res.msg);
                        }
                        
                    },error:function(res){
                        console.log("error2:"+JSON.stringify(res));
                    }
                })
                
            })        
            
            function getObjectURL(file) {
                var url = null ;
                if (window.createObjectURL!=undefined) { // basic
                url = window.createObjectURL(file) ;
                } else if (window.URL!=undefined) { // mozilla(firefox)
                url = window.URL.createObjectURL(file) ;
                } else if (window.webkitURL!=undefined) { // webkit or chrome
                url = window.webkitURL.createObjectURL(file) ;
                }
                return url ;
            }
        </script>