欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js實現(xiàn)上傳圖片預(yù)覽方法

 更新時間：2016年10月25日 08:35:56   作者：黎焱  
這篇文章主要為大家詳細(xì)介紹了js實現(xiàn)上傳照片預(yù)覽的方法,具有一定的參考價值，感興趣的小伙伴們可以參考一下

圖片預(yù)覽的 javascript 本地操作

早期瀏覽器，不能將本地圖片作為頁面元素處理，要實現(xiàn)圖片預(yù)覽需要將圖片先上傳到服務(wù)器，再從服務(wù)器取得進(jìn)行預(yù)覽

現(xiàn)代的瀏覽器功能越來越全面，因此可以實現(xiàn)對一些數(shù)據(jù)的本地處理 Chrome MsEdge(ie11) Firefox 

上圖的html

<tr>
<td>縮略圖</td>
<td>
　　<a href="javascript::void(0)" class="fileBtn">
　　選擇文件
　　<input type="file" id="file_pic">
　　</a>
</td>
</tr>
<tr>
<td></td>
<td><img id="file_view" style="width:110px"></td>
</tr>


// 下面用于圖片上傳預(yù)覽功能 objc : { file, pic, width }
 
yqUI.setImagePreview = function(objc) {
 
 var docObj=document.getElementById(objc.file);
 
 var imgObjPreview=document.getElementById(objc.pic);
 if(docObj.files &&docObj.files[0]){
 
 imgObjPreview.style.display = 'block';
 imgObjPreview.style.width = objc.width;
 imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
  
 return true;
 } else {
 return false;
 };
 
};
 
// 使用該控件, opts 配置對象
 
var opts = {
　　file : 'file_pic',
　　pic : 'file_view',
　　width : '180px'
}
 
yqUI.setImagePreview(opts);

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家?！?/p>

相關(guān)文章

最新評論