javascript - 「onmouseover」で画像を変更

Question

JavaScript を使用して画像 src を変更しようとしています。残念ながら、これはうまくいかないようです。誰が私が間違っているのか教えてもらえますか?

<script type="text/javascript">
  function changeImage(a) {
    document.getElementById("img").src=a;
}
</script>

<div class="fill">
<img id="img" src="books\thumbnail\10.jpg\">
<img src='books\big\4.jpg'  onmouseover='changeImage("books\bigger\4.jpg");'>
<img src='books\big\5.jpg'  onmouseover='changeImage("books\bigger\5.jpg");'>
<img src='books\big\6.jpg'  onmouseover='changeImage("books\bigger\6.jpg");'>
</div>

Answer 1

これを試して：-

<script type="text/javascript">
  function changeImage(a) {
    document.getElementById("img").src=a;
}
</script>

<div class="fill">
<img id="img" src="books/thumbnail/10.jpg/">
<img src='books/big/4.jpg'  onmouseover='changeImage("books/bigger/4.jpg");'>
<img src='books/big/5.jpg'  onmouseover='changeImage("books/bigger/5.jpg");'>
<img src='books/big/6.jpg'  onmouseover='changeImage("books/bigger/6.jpg");'>
</div>

Answer 2

document.getElementById("img").src=a;

ID「img」の要素を検索します。現在の画像を見つけるには

changeImage(this, "books\bigger\4.jpg");

と、

function changeImage(img, string)
{
    img.src = string;
}

Answer 3

JavaScript でこれを試してください:

document.getElementById("img").onmouseover=changeImage("http://placehold.it/500");

私のために働いた。