C# HTML输入-选择多个图像并在页面中查看它们？

我有以下html代码，允许您选择多个文件：

<input id="uploadFiles" type="file" name="myfiles" multiple="multiple" onchange="selectMulitableFiles(this)">

以下是onchange函数：

function selectMulitableFiles(e) {
    $.each(e.files, function () {
        var tempelete = '<tr><td><img onload="loadImage(this);" alt="" src=' + this.name + ' style="border-style: solid; border-width: 1px; width: 60px; height: 60px;" /></td></tr>';
        $("#tblImages tbody").append(tempelete);
    });
}

功能选择多个文件（e）{
$.each（例如文件、函数（）{
var tempelete=“”；
$（“#tblImages tbody”）.append（tempelete）；
});
}

我试图实现的是将所有这些选定的图像查看到我生成的图像中，然后在控件中写入，但e.value将只提供假路径。 我想做的是可能的还是不可能的？

这里是你的解决方案 您需要使用

FileReader（）

来提供图像src

function selectMulitableFiles(e) {
    $.each(e.files, function () {
      var reader = new FileReader();
      reader.onload = function (e) {
      var tempelete = '<tr><td><img onload="loadImage(this);" alt="" src=' + e.target.result + ' style="border-style: solid; border-width: 1px; width: 60px; height: 60px;" /></td></tr>';
        $("#tblImages tbody").append(tempelete);
      }

      reader.readAsDataURL(e.files[0]);

    });
}

功能选择多个文件（e）{
$.each（例如文件、函数（）{
var reader=new FileReader（）；
reader.onload=函数（e）{
var tempelete=“”；
$（“#tblImages tbody”）.append（tempelete）；
}
reader.readAsDataURL（e.files[0]）；
});
}

---

您的解决方案非常完美，只需将e.files[0]更改为“this”。谢谢