Rumah > hujung hadapan web > tutorial js > Bagaimana untuk memaparkan kesan pratonton imej yang dimuat naik dalam kemahiran Firefox_javascript yang serasi dengan js

Bagaimana untuk memaparkan kesan pratonton imej yang dimuat naik dalam kemahiran Firefox_javascript yang serasi dengan js

WBOY
Lepaskan: 2016-05-16 15:58:02
asal
1110 orang telah melayarinya

Contoh dalam artikel ini menerangkan kaedah Firefox yang serasi dengan js untuk memaparkan kesan pratonton imej yang dimuat naik. Kongsikan dengan semua orang untuk rujukan anda. Kaedah pelaksanaan khusus adalah seperti berikut:

<!doctype html> 
<html> 
<head> 
<meta content="text/html; charset=GBK" http-equiv="Content-Type" /> 
<title>Image preview example</title>
<style type="text/css">
 div {width:100px;height:100px;border: 1px #A3BFE7 solid;}
 img {width:atuo;height:atuo;}
</style> 
<script type="text/javascript"> 
 function viewPic() { 
 var oFReader = new FileReader();
 oFReader.onload = function(e) {
 document.getElementById("uploadPreview").src = e.target.result;
 }
 if (document.getElementById("uploadImage").files.length === 0) { 
 return;
 } 
 var oFile = document.getElementById("uploadImage").files[0];
 oFReader.readAsDataURL(oFile);
} 
</script> 
</head> 
<body>
<input id="uploadImage" type="file" name="myPhoto" 
onchange='viewPic();'/><br>
<img id="uploadPreview" src=""/>
</body> 
</html>

Salin selepas log masuk

Kesan operasi adalah seperti yang ditunjukkan di bawah:

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan