用js实现预览待上传的本地图片


Posted in Javascript onMarch 15, 2007

<form name="form5" id="form5" method="post" action="#">
<input type="file" name="file5" id="file5" onchange="preview5()"/>
</form>
<script type="text/javascript">
function preview5(){
var x = document.getElementById("file5");
 if(!x || !x.value) return;
var patn = /\.jpg$|\.jpeg$|\.gif$/i;
if(patn.test(x.value)){ 
var y = document.getElementById("img5");
if(y){
y.src = "file://localhost/" + x.value;
}else{
var img=document.createElement("img");      img.setAttribute("src","file://localhost/"+x.value);
img.setAttribute("width","120");
img.setAttribute("height","90");
img.setAttribute("id","img5");
document.getElementById("form5").appendChild(img);
 }
}else{
alert("您选择的似乎不是图像文件。");
}}
</script> 

Javascript 相关文章推荐
读jQuery之一(对象的组成)
Jun 11 Javascript
php对mongodb的扩展(初识如故)
Nov 11 Javascript
JS判断不同分辨率调用不同的CSS样式文件实现思路及测试代码
Jan 23 Javascript
基于MVC3方式实现下拉列表联动(JQuery)
Sep 02 Javascript
一个简单的实现下拉框多选的插件可移植性比较好
May 05 Javascript
node.js开发中使用Node Supervisor实现监测文件修改并自动重启应用
Nov 04 Javascript
基于javascript实现样式清新图片轮播特效
Mar 30 Javascript
简单讲解jQuery中的子元素过滤选择器
Apr 18 Javascript
jQuery的三种bind/One/Live/On事件绑定使用方法
Feb 23 Javascript
使用vue + less 实现简单换肤功能的示例
Feb 21 Javascript
JS数组实现分类统计实例代码
Sep 30 Javascript
Vue实现简易计算器
Feb 25 Javascript
从新浪弄下来的全屏广告代码 与使用说明
Mar 15 #Javascript
Z-Blog中用到的js代码
Mar 15 #Javascript
htm调用JS代码
Mar 15 #Javascript
QQ邮箱的一个文本编辑器代码
Mar 14 #Javascript
用js实现的一个Flash滚动轮换显示图片代码生成器
Mar 14 #Javascript
js实现的网站首页随机公告随机公告
Mar 14 #Javascript
newxtree.js代码
Mar 13 #Javascript
You might like
跨浏览器PHP下载文件名中的中文乱码问题解决方法
2015/03/05 PHP
Laravel中批量赋值Mass-Assignment的真正含义详解
2017/09/29 PHP
JavaScript 编程引入命名空间的方法与代码
2007/08/13 Javascript
javascript中删除指定数组中指定的元素的代码
2011/02/12 Javascript
JS数学函数Exp使用说明
2012/08/09 Javascript
通过jQuery源码学习javascript(二)
2012/12/27 Javascript
AJAX跨域请求json数据的实现方法
2013/11/11 Javascript
jquery 页面滚动到底部自动加载插件集合
2014/01/31 Javascript
javascript中style.left和offsetLeft的用法说明
2014/03/07 Javascript
Javascript学习笔记之相等符号与严格相等符号
2014/11/23 Javascript
javascript关于继承的用法汇总
2014/12/20 Javascript
jQuery中[attribute!=value]选择器用法实例
2014/12/31 Javascript
javascript事件冒泡和事件捕获详解
2015/05/26 Javascript
微信小程序后台解密用户数据实例详解
2017/06/28 Javascript
浅谈实现vue2.0响应式的基本思路
2018/02/13 Javascript
python实现随机密码字典生成器示例
2014/04/09 Python
Django框架下在URLconf中指定视图缓存的方法
2015/07/23 Python
python结合API实现即时天气信息
2016/01/19 Python
python+selenium开发环境搭建图文教程
2017/08/11 Python
python入门前的第一课 python怎样入门
2018/03/06 Python
python+PyQT实现系统桌面时钟
2020/06/16 Python
Python实现12306火车票抢票系统
2019/07/04 Python
python能做什么 python的含义
2019/10/12 Python
python机器学习实现决策树
2019/11/11 Python
Carter’s OshKosh加拿大:购买婴幼儿服装和童装
2018/11/27 全球购物
100%法国制造的游戏和玩具:Les Jouets Français
2021/03/02 全球购物
汽车维修专业毕业生的求职信分享
2013/12/04 职场文书
投标诚信承诺书
2014/05/26 职场文书
医药销售自荐书
2014/05/29 职场文书
图书室标语
2014/06/21 职场文书
幼儿园园务工作总结2015
2015/05/18 职场文书
青年联谊会致辞
2015/07/31 职场文书
python中使用 unittest.TestCase单元测试的用例详解
2021/08/30 Python
Java如何实现通过键盘输入一个数组
2022/02/15 Java/Android
Win11无法访问设备和打印机 如何解决页面空白
2022/04/09 数码科技
Django框架中表单的用法
2022/06/10 Python