0

ホバーしたときに画像のソースを変更したい。

私は1つの画像に対してそれを行うことができました

<img id="image1" src="image1-grey.png" onmouseover=colorImage(this) />"

と：

function colorImage(x){
document.getElementById("image1").src = x.src.replace("grey", "color");
}

私は十数枚の画像を持っています - すべてグレーとカラーの 2 つのバージョンがあります。

これで、すべての画像に対して上記の機能を個別に繰り返すことができると思いますが、よりクリーンな方法が必要です。

これは私が考え出したものですが、うまくいきません：

<img id="image1" src="image1-grey.png" onmouseover=colorImage(image1) />"

と：

function colorImage(x){
document.getElementById(x).src = this.src.replace("grey", "color");
}

こうすれば、すべての画像に対して 1 つの関数しか持たないと思いました。しかし、いいえ。なぜだめですか？

よろしくお願いします！

4

2 に答える 2

1

画像への参照をパラメーターとして渡しているため、document.getElementById を使用する必要はありません...既に取得済みです!

function colorImage(x){
  x.src = x.src.replace("grey", "color");
}

最初の方法を使用して、引き続き関数を呼び出すことができます。

<img id="image1" src="image1-grey.png" onmouseover=colorImage(this) />
于 2013-02-26T01:34:10.193 に答える
0

あなたの問題はimage1以下の行にあるようです

onmouseover=colorImage(image1)

文字列を渡すように、引用符で囲む必要があります (以下を参照)。

onmouseover=colorImage('image1')

あなたが今それを渡す方法は、あなたが望む文字列名の代わりにimage1（となる）という名前のjavascript変数を送信していますundefined"image1"

于 2013-02-26T01:36:57.840 に答える