h5圖片展示和ajax上傳

來源:互聯網
上載者:User

標籤: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上傳

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

Tags Index: