Javascript 试图获取鼠标移动到的图像的 ID

Question

我想获取鼠标悬停的图片的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 或更改该 particlair 图像的 image.className。但我不知道怎么调用它。现在它只提醒“缩略图”

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

Answer 1

使用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。