管理资源吧首页>>>教程>>>编程>>>JavaScript教程>>>

上传图片时JS自动显示图片

<HTML> 
<META http-equiv=Content-Type content="text/html; charset=gb2312"> 
<HEAD> 
<TITLE>javascript 图片预览</TITLE> 
</HEAD> 
<BODY> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3E%20%0D%0Afunction%20preview(imgFile%2Cnum)%20%0D%0A%7B%20%0D%0A%2F%2F%E9%A2%84%E8%A7%88%E4%BB%A3%E7%A0%81%EF%BC%8C%E6%94%AF%E6%8C%81%20IE6%E3%80%81IE7%E3%80%82%20%0D%0Avar%20newPreview%20%3D%20document.getElementById(%22preview1%22)%3B%20%0D%0Avar%20t%20%3B%20%0D%0Aif(document.all)%20%2F%2FIE%20%0D%0At%20%3D%20imgFile.value%3B%20%0D%0Aelse%20%0D%0At%20%3D%20imgFile.files%5B0%5D.getAsDataURL()%3B%20%2F%2FFF%20%0D%0AnewPreview.style.backgroundImage%20%3D%20%22url(%22%20%2B%20t%20%2B%20%22)%22%3B%2F%2FimgFile.value%3B%20%0D%0AnewPreview.style.width%20%3D%20%22108px%22%3B%20%0D%0AnewPreview.style.height%20%3D%20%22130px%22%3B%20%0D%0AnewPreview.style.display%20%3D%20%22block%22%3B%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> 
<input type="file" onchange='ShowImg(this)' /> 
<div id="preview1" style="border:1px solid #FFCC00; width:108px; height:130px;display:block" > 
</div> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3Efunction%20ShowImg(o)%20%0D%0A%7B%20%0D%0A%2F%2Fvar%20Browser_Agent%3Dnavigator.userAgent%3B%20%0D%0A%2F%2Fif(Browser_Agent.indexOf(%22Firefox%22)!%3D-1)%20%0D%0A%2F%2F%7B%20%0D%0A%2F%2F%E7%81%AB%E7%8B%90%E4%BD%BF%E7%94%A8%20%0D%0A%2F%2F%20document.getElementById(%22idImg%22).src%3Do.files%5B0%5D.getAsDataURL()%3B%20%0D%0A%2F%2F%20document.getElementById(%22idImg%22).style.display%20%3D%20%22block%22%3B%20%0D%0A%2F%2F%20%7D%20%0D%0A%2F%2Felse%20%0D%0A%2F%2F%7B%20%0D%0Apreview(o%2C1)%3B%20%0D%0A%2F%2F%7D%20%0D%0A%7D%20%3C%2Fscript%3E"> 
</BODY> 
</HTML>

　　 [Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

教程首页更多教程