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

时间:2024-06-19 13:50:35 

<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> 

标签:用js实现预览待上传的本地图片
0
投稿

猜你喜欢

  • 通过python模糊匹配算法对两个excel表格内容归类

    2023-02-14 20:57:49
  • MySQL无法创建外键的原因及解决方法

    2024-01-17 00:00:07
  • Python调用ChatGPT API接口的用法详解

    2022-10-11 23:29:25
  • Python排序搜索基本算法之希尔排序实例分析

    2023-03-27 14:06:07
  • python实现名片管理器的示例代码

    2023-12-11 05:34:50
  • 一文读懂JS中的var/let/const和暂时性死区

    2024-04-19 10:06:05
  • python将unicode转为str的方法

    2022-04-30 23:15:18
  • 一个月入门Python爬虫学习,轻松爬取大规模数据

    2022-03-10 11:04:26
  • 详解Django中CSRF和CORS的区别

    2021-02-19 19:16:51
  • python实现批量修改图片格式和尺寸

    2021-02-12 10:47:35
  • go第三方库sqlx操作MySQL及ORM原理

    2024-01-18 21:12:32
  • JS从数组中随机取出几个数组元素的方法

    2024-05-22 10:39:55
  • CentOS7安装Python3的教程详解

    2023-10-17 02:40:28
  • 灵活调用xsl来解析xml文档(js异步)

    2008-09-05 17:12:00
  • PHP格式化显示时间date()函数案例讲解

    2023-06-13 06:45:34
  • SQL Server CROSS APPLY和OUTER APPLY的应用详解

    2024-01-21 02:27:21
  • 99%的程序员都会收藏的书单 你读过几本?

    2022-10-01 19:45:59
  • asp如何做一个看他爱不爱你的小测验?

    2010-07-11 21:16:00
  • Pytorch模型定义与深度学习自查手册

    2023-02-11 18:30:27
  • python嵌套函数使用外部函数变量的方法(Python2和Python3)

    2022-05-16 20:29:25
  • asp之家 网络编程 m.aspxhome.com