※ ChatGPTを利用し、要約された質問です（原文：JavaScriptでの画像切り替えを複数セット）
JavaScriptでの複数画像切り替えの方法
このQ&Aのポイント
JavaScript初心者の方でも簡単に複数の画像切り替えを実装する方法について説明します。
IDを変えたセットでも正しく動作するようにするためのポイントを解説します。
複数の画像切り替えを作成する際に参考になるコード例を紹介します。
JavaScript初心者です。
サムネイルに画像を合わせると、IDの付いた画像2枚とテキストの3箇所が同時に入れ替える、
というものを以下の方法で作成しました。
<script>
function swap(n) {
var items = [
{ Text:"テキスト１", ImageB:"b/sample1.jpg", ImageA:"a/sample1.jpg" },
{ Text:"テキスト２", ImageB:"b/sample2.jpg", ImageA:"a/sample2.jpg" },
{ Text:"テキスト３", ImageB:"b/sample3.jpg", ImageA:"a/sample3.jpg" },
];
var o = document.getElementById("photo");
document.getElementById("Txt").innerHTML = items[n].Text;
document.getElementById("PhotoB").src = items[n].ImageB;
document.getElementById("PhotoA").src = items[n].ImageA;
}
</script>
<div id="photo">
<img src="sample1.jpg" alt="" name="PhotoB" id="PhotoB">
<img src="sample2.jpg" alt="" name="PhotoA" id="PhotoA">
<div id="Txt" name="Txt">説明文１</div>
</div>
<a href="#" onmouseover="swap(0)"><img src="sample1.jpg" /></a>
<a href="#" onmouseover="swap(1)"><img src="sample2.jpg" /></a>
<a href="#" onmouseover="swap(2)"><img src="sample3.jpg" /></a>
このセットを同一ページで複数作成したいのですが、
IDを変えたセットを作ってもうまく動かず、困っております。
知識不足で申し訳ありませんが、この場合、どのような方法でしたら
複数の画像切り替えを作れるのでしょうか？
よろしくお願い致します。
お礼
回答ありがとうございます！！！ 上記のソースをまとめて1セット、画像・テキストのみ違う、もう1セットを作りたかったのです。分かりにくくて申し訳ありませんでした。 ご指摘の通り、function名を変更する等して解決することができました！ 初心者のミスなのかもしれませんが、一人じゃとても行き詰まっていたので本当に感謝です。 ありがとうございました！！！！！！