Question

我有一系列图像元素，

var im = ["im1","im2"]; // from db or local drive

然后动态创建图像：

var l = imagelist.length;
for (var i = 0; i < l; ++i) {
    if (i in im) {
    var s = im[i];

    var img = document.createElement("img");
    img.src = s;
    img.width = width;
    img.draggable = true;

    var body = document.getElementById("body");
    body.appendChild(img);

    this.addEventListener('ondragstart', function(event) {
        alert(event.target.id);
        event.dataTransfer.setData('text/plain', event.target.id);
    });

}

ondragstart事件触发，但alert(event.target.id);显示为空白。

这就是原因，拖放功能对于动态创建的图像数组不起作用。

虽然尝试使用单个图像标记<img>进行拖动但效果非常好，但图像数组不能以这种方式工作。

对此有何解决方案？

Answer 1

您尚未为任何元素分配id。

这样的事情可以解决问题：

var img = document.createElement("img");
img.src = s;
img.id = "image_" + i;
// The rest of your assignments and code...

在javascript中动态地在一个元素数组上的ondragstart

1 个答案: