用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 相关文章推荐
js 函数的执行环境和作用域链的深入解析
Nov 01 Javascript
在javascript中如何得到中英文混合字符串的长度
Jan 17 Javascript
简单易用的倒计时js代码
Aug 04 Javascript
浅析Javascript中“==”与“===”的区别
Dec 23 Javascript
浅析js中substring和substr的方法
Nov 09 Javascript
ES6中新增的Object.assign()方法详解
Sep 22 Javascript
完美解决手机浏览器顶部下拉出现网页源或刷新的问题
Nov 30 Javascript
vue实现前进刷新后退不刷新效果
Jan 26 Javascript
解决vue 按钮多次点击重复提交数据问题
May 10 Javascript
微信小程序实现单列下拉菜单效果
Apr 25 Javascript
JS获取表格视图所选行号的ids过程解析
Feb 21 Javascript
JavaScript ES 模块的使用
Nov 12 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
PHP5中虚函数的实现方法分享
2011/04/20 PHP
求PHP数组最大值,最小值的代码
2011/10/31 PHP
鸡肋的PHP单例模式应用详解
2013/06/03 PHP
PHP中addslashes()和stripslashes()实现字符串转义和还原用法实例
2016/01/07 PHP
JSON两种结构之对象和数组的理解
2016/07/19 PHP
PHP实现从上往下打印二叉树的方法
2018/01/18 PHP
phpstorm 正则匹配删除空行、注释行(替换注释行为空行)
2018/01/21 PHP
php微信支付之公众号支付功能
2018/05/30 PHP
QQ登录简单实现代码
2021/03/09 Javascript
修改好的jquery滚动字幕效果实现代码
2011/06/22 Javascript
jQuery打印指定区域Html页面并自动分页
2014/07/04 Javascript
nodejs之请求路由概述
2014/07/05 NodeJs
JavaScript面试题大全(推荐)
2016/09/22 Javascript
原生JavaScript制作计算器
2016/10/16 Javascript
详解基于 axios 的 Vue 项目 http 请求优化
2017/09/04 Javascript
layui的table中显示图片方法
2018/08/17 Javascript
vue 使用html2canvas将DOM转化为图片的方法
2018/09/11 Javascript
使用SAE部署Python运行环境的教程
2015/05/05 Python
安装Python和pygame及相应的环境变量配置(图文教程)
2017/06/04 Python
Python求均值,方差,标准差的实例
2019/06/29 Python
利用Python进行图像的加法,图像混合(附代码)
2019/07/14 Python
pandas将多个dataframe以多个sheet的形式保存到一个excel文件中
2019/10/10 Python
Python实现遗传算法(二进制编码)求函数最优值方式
2020/02/11 Python
宝塔面板成功部署Django项目流程(图文)
2020/06/22 Python
Anaconda的安装与虚拟环境建立
2020/11/18 Python
Trip.com香港网站:Ctrip携程旗下,全球最大的网上旅游社之一
2016/08/01 全球购物
StudentUniverse英国:学生航班、酒店和旅游
2019/08/25 全球购物
产品促销活动策划书
2014/01/15 职场文书
40岁生日感言
2014/02/15 职场文书
大学新生入学教育方案
2014/05/16 职场文书
社区维稳工作方案
2014/06/06 职场文书
中药学自荐信
2014/06/15 职场文书
上海世博会志愿者口号
2014/06/17 职场文书
小时代观后感
2015/06/10 职场文书
结婚喜宴迎宾词
2015/08/10 职场文书
Python OpenCV之常用滤波器使用详解
2022/04/07 Python