Javascript 在同一页面中多次使用js

我所做的很简单，当鼠标经过图像源时，我会更改图像源，然后当鼠标离开图像源时，将旧图像源放回原处

<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(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')"/>

function roll\u over（ctrl，img\u src）{
ctrl.src=img_src；
}

是否为页面上的每个元素使用唯一id？请尝试使用

此

而不是要传递的元素id（Image1）。这将为您节省所有的

id

s.Gabe是的，但现在我使用的是'This'，更好，thnx ssapkota@是的，我知道，你选择了我的答案。呵呵，我以为你是另一个人：$

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')"/>