保存图像 src 的功能不起作用

Function to save image's src doesn't work

本文关键字：功能 不起作用 src 图像 保存      更新时间：2023-09-26

下面的代码显示图像，如果我单击它，则选择其中一个（带有蓝色边框）。它还将所选的 src 存储在变量 （ src1 中，但最后一点不起作用。我的错误在哪里？谢谢你们！

var src1 = "";
var img = new Array();
img[0] = new Image();
img[0].src = "../images/poggiatesta2.jpg";
img[1] = new Image();
img[1].src = "../images/poggiatesta1.JPG";
img[2] = new Image();
img[2].src = "../images/poggiatesta3.jpg";
for (var i = 0; i < img.length; i++) {
    var imagetag = document.createElement("img");
    var onclick = document.createAttribute("onclick");
    onclick.value = "myfun(" + i + ")";
    var sorc = document.createAttribute("src");
    sorc.value = img[i].src;
    var id = document.createAttribute("id");
    id.value = "my_image" + i;
    var clas = document.createAttribute("class");
    clas.value = "my_image_clas";
    imagetag.setAttributeNode(clas);
    imagetag.setAttributeNode(onclick);
    imagetag.setAttributeNode(sorc);
    imagetag.setAttributeNode(id);
    document.body.appendChild(imagetag);
}
function myfun(i) {
    src1 = document.getElementById('my_image' + i).src;
}
var _last = null;
function select(element) {
    element.onclick = function () {
        element.classList.toggle('selected');
        if (_last) _last.classList.remove("selected");
        _last = element.classList.contains("selected") ? element : null;
    }
}
Array.from(document.getElementsByClassName('my_image_clas')).forEach(select);

您使用错误的方式来添加元素的事件。您的事件不会触发。

请改用这种方式：

var imagetag = document.createElement("img");
imagetag.onclick = function () {
    myfun(i);
};

试试这个：

    var src1 = "";
    var img = new Array();
    img[0] = new Image();
    img[0].src = "../images/poggiatesta2.jpg";
    img[1] = new Image();
    img[1].src =  "../images/poggiatesta1.JPG";
    img[2] = new Image();
    img[2].src =  "../images/poggiatesta3.jpg";

 for (var i = 0; i < img.length; i++) {
    var imagetag = document.createElement("img");

    var sorc = document.createAttribute("src");
    sorc.value = img[i].src;
    var id = document.createAttribute("id");
    id.value = "my_image" + i;
    var clas = document.createAttribute("class");
    clas.value = "my_image_clas";
    imagetag.setAttributeNode(clas);
    imagetag.setAttributeNode(sorc);
    imagetag.setAttributeNode(id);
    document.body.appendChild(imagetag);
}
var _last = null;
function select(element) {
    element.onclick = function () {
        element.classList.toggle('selected');
        if (_last) _last.classList.remove("selected");
        _last = element.classList.contains("selected") ? element : null;
        src1 = _last.src;
    }
}
Array.from(document.getElementsByClassName('my_image_clas')).forEach(select);
相关文章：