3

我想获取鼠标悬停的图像的 id。但我不明白如何获得身份证。有人能帮我吗 ：）。泰！

function placeImage(x){
var div = document.getElementById("thumbnails");
div.innerHTML = ""; // clear images
for (var i =0; i <= x; i++) {

var image=document.createElement("img");
image.className += " Atributes";
image.src="images/foto_klein_"+i+".jpg";
image.width="135";
image.height="90";
image.alt="foto_klein_"+i;
image.id="image"+i;
image.position="relative";
div.appendChild(image);
image.style.marginRight = '10px';
_img.push(image);

}
};

使用 placeImage 函数，我可以放置图像。现在我想添加一个鼠标事件并更改目标图像的类。

<div id="thumbnails" onmouseover="mouseOver(this);" ></div>

我在所有缩略图上添加了鼠标。但我无法获得鼠标悬停的图像的 id。我想调用 id 或更改该粒子图像的 image.className。但我不知道怎么称呼它。现在它只提醒“缩略图”

function mouseOver(e){
 alert(e.id);
}
4

3 回答 3

7

使用this关键字：

<div id="thumbnails" onmouseover="mouseOver(this);" ></div>

function mouseOver(e){
   alert(e.id);
}

从评论中编辑：

var image=document.createElement("img");
   image.className += " Atributes";
   image.src="images/foto_klein_"+i+".jpg";
   image.width="135";
   image.height="90";
   image.alt="foto_klein_"+i;
   image.id="image"+i;
   image.mouseover = mouseOver;
   image.position="relative";
   div.appendChild(image);
   image.style.marginRight = '10px';
   _img.push(image);

}

请注意mouseOver图像悬停时调用的函数。 this将引用图像元素而不是 div。

于 2013-02-14T15:47:33.690 回答
1

要在id将鼠标悬停在图像上时获取图像，请尝试以下操作：

function placeImage(x){
    var div = document.getElementById("thumbnails");
    div.innerHTML = ""; // clear images
    for (var i =0; i <= x; i++) {
        var image=document.createElement("img");
        image.className += " Atributes";
        image.src="images/foto_klein_"+i+".jpg";
        image.width="135";
        image.height="90";
        image.alt="foto_klein_"+i;
        image.id="image"+i;
        image.position="relative";
        image.onmouseover = mouseOver;    // <-- Added this
        div.appendChild(image);
        image.style.marginRight = '10px';
        _img.push(image);
    }
}

function mouseOver(e) {
    alert(this.id);
}
于 2013-02-14T16:03:46.960 回答
-1

希望这会有所帮助，尽管我不确定它是否适用于动态添加的图像。

document.ready = function () {
    var thumbnails = document.getElementById("thumbnails");

    var imgs = thumbnails.getElementsByTagName("img");

    for( var i=0; i<imgs.length; i++ ) {
        imgs[i].onmouseover = function() {
            alert( this.id );
        }
    }
};
于 2013-02-14T16:20:39.660 回答