Javascript 上传图像并使用JQuery将其附加到正文中

我试图使一个网站建设者，我们可以选择添加HTML元素 比如文本、图像、视频等。 为了通过设备上传图像，我使用

$（文档）.ready（函数（）{
$（“#添加图像”）。单击（函数（）{
$（“#文件输入”）。单击（）；
});
$（“#文件输入”）。单击（函数（）{
$（“#文件输入”）.change（函数（）{
if（this.files&&this.files[0]）{
var reader=new FileReader（）；
reader.onload=imagesisload；
reader.readAsDataURL（this.files[0]）；
}
});
});
var x=0；
函数imageIsLoaded（e）{
变量图片=“”
$（“正文”）。附加（图片）；
x=x+1；
}
});

上传图像
重复图像的问题是因为您正在分配一个新的
在每次连续单击时更改事件处理程序。因此，在第N次单击时，会附加N个图像。只需从
click（）
事件中打开
change
事件处理程序

此外，要删除上一个图像，您可以在添加下一个图像之前将图像附加到容器并
empty（）
该容器，如下所示：


$（文档）.ready（函数（）{
$（“#添加图像”）。单击（函数（）{
$（“#文件输入”）。单击（）；
});
$（“#文件输入”）.change（函数（）{
if（this.files&&this.files[0]）{
var reader=new FileReader（）；
reader.onload=imagesisload；
reader.readAsDataURL（this.files[0]）；
}
});
函数imageIsLoaded（e）{
变量x='foo'；
变量图片=“”
$（“.preview”）.empty（）.append（图片）；
}
});

上传图像
谢谢你的回答。但我实际上想添加多个图像，即不删除以前的图像。因此，我无法将图像添加到静态div。另外，知道如何使用函数change（）连续添加相同的图像吗？
文件
输入不是这样工作的。如果要从一个输入上载多个文件，请向元素添加
multiple=“true”
属性，但是每次更新都会覆盖以前的属性；您不能连续地将文件附加到输入中。更像这样：-请记住，当您从“文件”对话框中选择以测试新属性时，添加多个图像文件。这将非常有用。是的，部分是这样。但我希望我可以为change（）找到一个替代函数，类似于add（）当选择没有变化时，该选项也起作用