h5圖片展示和ajax上傳

標籤：target   logs   event   new   對象   end   圖片展示   img   通過   

<img src="" id="img"/><script src="http://static.lamian.tv//pc/public/js/jquery-1.8.3.min.js?v=e128811631"></script><script>    $(‘#file‘).change(function (e) {        console.log(event.target.files);        var files = event.target.files, file;        if (files && files.length > 0) {            file = files[0];            // 來在控制台看看到底這個對象是什麼            // console.log(file);            // 那麼我們可以做一下諸如檔案大小校正的動作            if(file.size > 1024 * 1024 * 2) {                alert(‘圖片大小不能超過 2MB!‘);                return false;            }            // !!!!!!            // 下面是關鍵的關鍵，通過這個 file 對象產生一個可用的映像 URL            // 擷取 window 的 URL 工具            var URL = window.URL || window.webkitURL;            // 通過 file 產生目標 url            var imgURL = URL.createObjectURL(file);            // 用這個 URL 產生一個 <img> 將其顯示出來            $(‘#img‘).attr(‘src‘, imgURL);        }    })</script>

<script>var formData = new FormData();var name = $("input").val();formData.append("file",$("#upload")[0].files[0]);formData.append("name",name);$.ajax({          url : Url,          type : ‘POST‘,          data : formData,          // 告訴jQuery不要去處理髮送的資料        processData : false,         // 告訴jQuery不要去設定Content-Type要求標頭        contentType : false,        beforeSend:function(){               console.log("進行中，請稍候");                },        success : function(responseStr) {             if(responseStr.status===0){                console.log("成功"+responseStr);            }else{                console.log("失敗");            }        },          error : function(responseStr) {             console.log("error");        }      });</script>

 

h5圖片展示和ajax上傳