发布于 2017-01-11 16:35:30 | 22 次阅读 | 评论: 0 | 来源: 网友投递

这里有新鲜出炉的Javascript教程,程序狗速度看过来!

JavaScript客户端脚本语言

Javascript 是一种由Netscape的LiveScript发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。


本代码从file域获取本地图片url并将本地图片显示到浏览器上,具体实现如下,感兴趣的朋友可以参考下,希望对大家有所帮助
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<script type="text/javascript"> 
/** 
* 从 file 域获取 本地图片 url 
*/ 
function getFileUrl(sourceId) { 
var url; 
if (navigator.userAgent.indexOf("MSIE")>=1) { // IE 
url = document.getElementById(sourceId).value; 
} else if(navigator.userAgent.indexOf("Firefox")>0) { // Firefox 
url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0)); 
} else if(navigator.userAgent.indexOf("Chrome")>0) { // Chrome 
url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0)); 
} 
return url; 
} 

/** 
* 将本地图片 显示到浏览器上 
*/ 
function preImg(sourceId, targetId) { 
var url = getFileUrl(sourceId); 
var imgPre = document.getElementById(targetId); 
imgPre.src = url; 
} 
</script> 
</head> 
<body> 
<form action=""> 
<input type="file" name="imgOne" id="imgOne" onchange="preImg(this.id,'imgPre');" /> 
<img id="imgPre" src="" width="300px" height="300px" style="display: block;" /> 
</form> 
</body> 
</html> 


相关阅读 :
JS预览图像将本地图片显示到浏览器上
在页面预览客户端本地图片的js代码(兼容FF IE)
无刷新预览所选择的图片示例代码
JS文件/图片从电脑里面拖拽到浏览器上传文件/图片
js兼容火狐显示上传图片预览效果的方法
用js实现预览待上传的本地图片
js本地图片预览实现代码
JS上传图片预览插件制作(兼容到IE6)
浅谈js图片前端预览之filereader和window.URL.createObjectURL
js实现上传图片及时预览
js实现纯前端的图片预览
如何通过js实现图片预览功能【附实例代码】
最新网友评论  共有(0)条评论 发布评论 返回顶部

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务