如何通过射流研究…实现图片预览功能【附实例代码】

实现代码：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML 1/DTD/XHTML 1-Transitional。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；charset=gb2312' /titlejs图片预览功能/title脚本语言=JavaScript函数预览文件(){ var preview=document。query selector(' img ')；var文件=文档。query selector(' input[type=file]').文件[0];var reader=new FileReader()；读者。onloadend=function(){ preview。src=阅读器。结果；}如果(文件){ reader.readAsDataURL(文件);} else { preview . src=}/script/head dyinput type=' file ' onchange=' preview file()' brimg src=' http : ' height=' 200 ' width=' 300 ' alt=' Image preview . '//正文/html效果预览

效果图：

以上这篇如何通过射流研究…实现图片预览功能【附实例代码】就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。