Javascript 查看具有唯一ID的多个浏览图像

在stackoverflow中搜索之后，我终于找到了一个可以浏览多个图像并逐个预览它们的代码。但是，当我在浏览器中检查元素时，每个图像的所有id都是相同的

所以，我希望任何人都能帮助我修改这段代码，使浏览的每个图像都有自己的唯一id

及

以下是html表单：

<input id="imgInput" type="file"  name="file[]" multiple style="display:none;"/>
    <input type="button" onclick="$('#imgInput').click();" value="Choose File" />
     <output id="result" ></output>

<div style="margin-top:150px;" id="uploadedcontent"></div>

以下是JS代码：

         var ftype = new Array();

    $("#imgInput").change(function () {
        readURL(this);

    });
    function readURL(input) {
        var files = input.files;
        var output = document.getElementById("result");
        var count = 0;
         var count1 = 0;
        for (var i = 0; i < files.length; i++) {
            var file = files[i];
            var picReader = new FileReader();
            var divid = 'div_' + i;
            var spanid = 'span_' + i;
            picReader.addEventListener("load", function (event) {
                var picFile = event.target;
                var picnames = files[count].name;
                var mimetypes = picFile.result.split(',');
                var mimetype1 = mimetypes[0];
                var mimetype = mimetype1.split(':')[1].split(';')[0];
                count++;

                var div = document.createElement("div");
                div.setAttribute('id', 'div_' + count);
                div.setAttribute('class', 'divclass');
                if (mimetype.match('image')) {
                    div.innerHTML = "<img id='img_" +  count + "' class='thumbnail' src='" + picFile.result + "'" +
                        "title='" + picnames + "' width='96' height='80' alt='Item Image' style='position:relative;padding:10px 10px 10px 10px;' data-valu='" + mimetype + "'/><span class='boxclose' style='cursor:pointer' id='span_" + count + "'>x</span>";

                }

                output.insertBefore(div, null);

            });

            picReader.readAsDataURL(file);
        }
    }

var ftype=new Array（）；
$（“#imgInput”）。更改（函数（）{
readURL（this）；
});
函数readURL（输入）{
var files=input.files；
var输出=document.getElementById（“结果”）；
var计数=0；
var count1=0；
对于（var i=0；i

它只需要div上使用的计数，添加到img中只是一个微小的更改，请参见下面的fiddle

var ftype=new Array（），count1=0

    $("#imgInput").change(function () {
        readURL(this);

    });
    function readURL(input) {
        var files = input.files;
        var output = document.getElementById("result");
        var count = 0;
         var count1 = 0;
        for (var i = 0; i < files.length; i++) {
            var file = files[i];
            var picReader = new FileReader();
            var divid = 'div_' + i;
            var spanid = 'span_' + i;
            picReader.addEventListener("load", function (event) {
                var picFile = event.target;
                var picnames = files[count].name;
                var mimetypes = picFile.result.split(',');
                var mimetype1 = mimetypes[0];
                var mimetype = mimetype1.split(':')[1].split(';')[0];
                count++;
                count1++;

                var div = document.createElement("div");
                div.setAttribute('id', 'div_' + count);
                div.setAttribute('class', 'divclass');
                if (mimetype.match('image')) {

                    // below we add the id using the count used for the div;
                    div.innerHTML = "<img id='img_" +  count1 + "' class='thumbnail' src='" + picFile.result + "'" +
                        "title='" + picnames + "' width='96' height='80' alt='Item Image' style='position:relative;padding:10px 10px 10px 10px;' data-valu='" + mimetype + "'/><span class='boxclose' style='cursor:pointer' id='span_" + count + "'>x</span>";

                }

                output.insertBefore(div, null);

            });

            picReader.readAsDataURL(file);
        }
    }

$（“#imgInput”）.change（函数（）{
readURL（this）；
});
函数readURL（输入）{
var files=input.files；
var输出=document.getElementById（“结果”）；
var计数=0；
var count1=0；
对于（var i=0；i

@downvorters这是一个合法的问题，请考虑添加一条评论……不要因为downvorters而感到内疚，但我建议您在实际问题中添加更多代码，而不是链接。链接断开。我正要添加代码。现在又加上了？铬合金测试-似乎工作。生成了两个唯一的ID。惊人的是：D非常感谢你，我的兄弟