在同一頁面中多次使用 js

Question

我正在做的事情很簡單，當鼠標經過它時我會更改圖像源，然后在它出來時將舊的放回去..

<img id="Image1" src="../../Images/M2.jpg" onmouseover="roll_over('../../Images/M3.jpg','Image1')" onmouseout="roll_over('../../Images/M2.jpg','Image1')"/>

使用這個 javascript：

function roll_over(img_src,id) {
document.getElementById(id).src = img_src;
}

我發現 JavaScript 在移動到另一個圖像時不會更新圖像，它只會更改鼠標經過它的第一個圖像，我需要它來更改它經過的每個圖像。

我能做些什么來解決這種情況？

Answer 1

嘗試像這樣重寫它：

function roll_over(ctrl, img_src) {
   ctrl.src = img_src;
}

<img id="Image1" src="../../Images/M2.jpg" onmouseover="roll_over(this, '../../Images/M3.jpg')" onmouseout="roll_over(this, '../../Images/M2.jpg')"/>