所以我正在为客户工作一个网站。我需要帮助的区域是照片的上传和预览区域。这张照片不需要在这个过程中传输，只需要上传和预览一个例子 - 牙科诊所。
有5个示例照片和5个上传部分，他们将在示例旁边预览照片。
我正在使用的代码是：
<style>
/* Image Designing Propoerties */
.thumb {
height: 75px;
border: 1px solid #000;
margin: 10px 5px 0 0;
}
</style>
<script type="text/javascript">
/* The uploader form */
$(function () {
$(":file").change(function () {
if (this.files && this.files[0]) {
var reader = new FileReader();
reader.onload = imageIsLoaded;
reader.readAsDataURL(this.files[0]);
}
});
});
function imageIsLoaded(e) {
$('#myImg').attr('src', e.target.result);
$('#yourImage').attr('src', e.target.result);
};
</script>
<input type='file' />
</br><img id="myImg" src="#" alt="your image" height=247 width=330>
所以这是踢球者。当我将此代码用于一个代码块（在Squarespace平台上构建）时，它将上传并显示该块的照片没问题。
当我将它添加到其他区域时，上传目的地要么改变到另一个区域，要么调整它我有两个块来显示相同的图像，但我不知道如何写它，所以每个块显示自己的图像和我不确定我会忽略ID或SRC的明智之处。
如果需要，我很乐意发送链接和站点密码进行进一步检查。在此先感谢，第一次使用stackoverflow帮助聊天。
我刚刚创建了一个function readurl(a)，我传递参数a。这个参数将告诉我们想要预览图像的id的input和id的img的功能。因为elements中所有html的id应该是不同的。
HTML和JS代码
function readurl(a)
{
input=document.getElementById('input'+a);
if (input.files && input.files[0])
{
var reader = new FileReader();
reader.onload = function (e)
{
document.getElementById('blah'+a).src=e.target.result;
};
reader.readAsDataURL(input.files[0]);
}
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div class="new_img_container" >
<label id="file">Upload image
<input onchange="readurl(1)" id="input1" name="product_img" type="file" name="image" size="60" required>
</label>
<br>
<img id="blah1" src="../images/product_image.png" alt="product_image" >
</div>
<br><br>
<div class="new_img_container" >
<label id="file">Upload image
<input onchange="readurl(2)" id="input2" name="product_img" type="file" name="image" size="60" required>
</label>
<br>
<img id="blah2" src="../images/product_image.png" alt="product_image" >
</div>
</body>
</html>我没有为样式添加任何CSS。