用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的25个步骤 千倍级效率提升
Feb 11 Javascript
javascript面向对象编程(一) 实例代码
Jun 25 Javascript
select、radio表单回显功能实现避免使用jquery载入赋值
Jun 08 Javascript
浅析jQuery对select操作小结(遍历option,操作option)
Jul 04 Javascript
JS获取鼠标坐标位置实例分析
Jan 20 Javascript
Javascript的表单验证-揭开正则表达式的面纱
Mar 18 Javascript
js实现动态创建的元素绑定事件
Jul 19 Javascript
关于Jquery中的bind(),on()绑定事件方式总结
Oct 26 Javascript
使用vue.js2.0 + ElementUI开发后台管理系统详细教程(二)
Jan 21 Javascript
Vue2.x中利用@font-size引入字体图标报错的解决方法
Sep 28 Javascript
iview实现动态表单和自定义验证时间段重叠
Jan 10 Javascript
详解如何使用Node.js实现热重载页面
May 06 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
使用PHPMyAdmin修复论坛数据库的图文方法
2012/01/09 PHP
编译php 5.2.14+fpm+memcached(具体操作详解)
2013/06/18 PHP
PHP多文件上传实例
2015/07/09 PHP
PHP使用Pthread实现的多线程操作实例
2015/11/14 PHP
PHP实现仿百度文库,豆丁在线文档效果(word,excel,ppt转flash)
2016/03/10 PHP
Laravel中服务提供者和门面模式的入门介绍
2017/11/06 PHP
详解PHP 二维数组排序保持键名不变
2019/03/06 PHP
js替换字符串的所有示例代码
2013/07/23 Javascript
通过JQuery将DIV的滚动条滚动到指定的位置方便自动定位
2014/05/05 Javascript
玩转方法:call和apply
2014/05/08 Javascript
网页收藏夹显示ICO图标(代码少)
2015/08/04 Javascript
jquery+CSS实现的多级竖向展开树形TRee菜单效果
2015/08/24 Javascript
jQuery热气球动画半透明背景的后台登录界面代码分享
2015/08/28 Javascript
jQuery插件实现静态HTML验证码校验
2015/11/06 Javascript
JavaScript和HTML DOM的区别与联系及Javascript和DOM的关系
2015/11/15 Javascript
jquery点击改变class并toggle的实现代码
2016/05/15 Javascript
javascript封装addLoadEvent实现页面同时加载执行多个函数的方法
2016/07/25 Javascript
javascript获取网页各种高宽及位置的方法总结
2016/07/27 Javascript
AngularJS开发教程之控制器之间的通信方法分析
2016/12/25 Javascript
layui之table checkbox初始化时选中对应选项的方法
2019/09/02 Javascript
vue+element表格导出为Excel文件
2019/09/26 Javascript
vue学习笔记之作用域插槽实例分析
2020/02/01 Javascript
jquery制作的移动端购物车效果完整示例
2020/02/24 jQuery
Python中的对象,方法,类,实例,函数用法分析
2015/01/15 Python
用 Python 爬了爬自己的微信朋友(实例讲解)
2017/08/25 Python
通用的Django注册功能模块实现方法
2021/02/05 Python
美国成衣女装品牌:CHICO’S
2016/09/19 全球购物
eBay比利时购物网站:eBay.be
2019/08/09 全球购物
大专毕业自我鉴定
2014/02/04 职场文书
教师师德反思材料
2014/02/15 职场文书
党员公开承诺书范文
2014/03/25 职场文书
假面舞会策划方案
2014/05/29 职场文书
大学生求职信例文
2014/06/29 职场文书
党的群众路线教育实践活动心得体会(乡镇)
2014/11/03 职场文书
基于CSS3画一个iPhone
2021/04/21 HTML / CSS
一次项目中Thinkphp绕过禁用函数的实战记录
2021/11/17 PHP