js实现图片在线预览

最新推荐文章于 2024-05-26 12:42:56 发布

八月长安个人专栏

最新推荐文章于 2024-05-26 12:42:56 发布

阅读量1.2k

点赞数

CC 4.0 BY-SA版权

分类专栏： js在线预览文章标签： js实现图片在线预览

本文链接：https://blog.youkuaiyun.com/weber0000/article/details/77947666

该博客介绍了如何利用JavaScript实现图片的在线预览功能，包括代码展示和实际效果的预览。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

js在线预览图片

一、效果预览

二、实现代码：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js图片在线预览</title>
<script language=javascript>
 function viewPic(obj){
		var fileUrl=$(obj).attr("fileUrl");
		var title=$(obj).attr("title");
		$("#pic").attr("src",fileUrl);
		$("#pictitle").html(title);
	}
</script>
</head>
<body>
<input type="file" onchange="previewFile()"><br>
<img src="" height="200" width="300" alt="Image preview..."/>
<div class="row">
<c:forEach items="${fileList }" var="