用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 相关文章推荐
做网页的一些技巧
Feb 01 Javascript
JS判断文本框内容改变事件的简单实例
Mar 07 Javascript
JavaScript跨域方法汇总
Oct 16 Javascript
c#+jquery实现获取radio和checkbox的值
Sep 12 Javascript
浅谈JavaScript对象的创建方式
Jun 13 Javascript
探讨跨域请求资源的几种方式(总结)
Dec 02 Javascript
Bootstrap表单控件使用方法详解
Jan 11 Javascript
jquery 判断是否支持Placeholder属性的方法
Feb 07 Javascript
Vue2.0组件间数据传递示例
Mar 07 Javascript
Vue的事件响应式进度条组件实例详解
Feb 04 Javascript
JS+HTML实现的圆形可点击区域示例【3种方法】
Aug 01 Javascript
工作中常用到的ES6语法
Sep 04 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.MVC的模板标签系统(五)
2006/09/05 PHP
PHP 工厂模式使用方法
2010/05/18 PHP
php 过滤器实现代码
2010/08/09 PHP
如何在HTML 中嵌入 PHP 代码
2015/05/13 PHP
什么是OneThink oneThink后台添加插件步骤
2016/04/13 PHP
php array_pop 删除数组最后一个元素实例
2016/11/02 PHP
PHP基于rabbitmq操作类的生产者和消费者功能示例
2018/06/16 PHP
会自动逐行上升的文本框
2006/06/30 Javascript
JavaScript 设计模式学习 Factory
2009/07/29 Javascript
玩转方法:call和apply
2014/05/08 Javascript
再谈JavaScript线程
2015/07/10 Javascript
jQuery+css3实现Ajax点击后动态删除功能的方法
2015/08/10 Javascript
原生javascript实现图片无缝滚动效果
2016/02/12 Javascript
js操作数据库实现注册和登陆的简单实例
2016/05/26 Javascript
JS Ajax请求如何防止重复提交
2016/06/13 Javascript
简单的js计算器实现
2016/10/26 Javascript
jQuery实现滚动条滚动到子元素位置(方便定位)
2017/01/08 Javascript
js使用i18n实现页面国际化的方法
2017/05/09 Javascript
JavaScript 巧学巧用
2017/05/23 Javascript
深入浅析Nodejs的Http模块
2017/06/20 NodeJs
JavaScript体验异步更好的解决办法
2018/01/08 Javascript
vue2.0 实现页面导航提示引导的方法
2018/03/13 Javascript
vue通过点击事件读取音频文件的方法
2018/05/30 Javascript
浅析vue-router jquery和params传参(接收参数)$router $route的区别
2018/08/03 jQuery
JS中的算法与数据结构之常见排序(Sort)算法详解
2019/08/16 Javascript
Python 中 Meta Classes详解
2016/02/13 Python
python 简单的多线程链接实现代码
2016/08/28 Python
python 3.6 tkinter+urllib+json实现火车车次信息查询功能
2017/12/20 Python
Python编程实现线性回归和批量梯度下降法代码实例
2018/01/04 Python
判断python字典中key是否存在的两种方法
2018/08/10 Python
python实现大文本文件分割
2019/07/22 Python
Python能做什么
2020/06/02 Python
Python 字典中的所有方法及用法
2020/06/10 Python
2014年汽车销售工作总结
2014/12/01 职场文书
2015年秋学期师德师风建设工作总结
2015/10/23 职场文书
导游词之安徽醉翁亭
2020/01/10 职场文书