Question

我是JavaScript的新手，我想知道如何在JavaScript中为不同的元素使用相同的函数。

即。如何在函数中设置document.getElementById的id值。我不知道为什么我的代码不起作用。

的JavaScript

function onhover(imgx)
{
    var x = imgx;
    document.getElementById('x').style.opacity=0.5;
}

HTML

<img id="img1" src="img1.jpg" onmouseout="onhover('img1')">
<img id="img2" src="img2.jpg" onmouseout="onhover('img2')">

Answer 1

假设所有处理程序都不应该在标记内部定义（为了逻辑和内容之间的分离），试试这个

<img id="img1" src="img1.jpg" onmouseout="onhover(this)">
<img id="img2" src="img2.jpg" onmouseout="onhover(this)">

function onhover(img) {
   img.style.opacity=0.5;
}

Answer 2

对代码进行微不足道的更改 - 删除x周围的单引号。当您使用单引号或双引号时，您传递字符串“x”而不是变量x的值。

function onhover(imgx)
{
    var x = imgx;
    document.getElementById(x).style.opacity=0.5;
}

但老实说，你可以马上使用imgx;将其保存到x有点不必要。

Answer 3

我已经为您创建了codebin，请使用以下链接进行检查。

http://codebins.com/codes/home/4ldqpcc

将一个函数用于不同的元素javascript

3 个答案: