ボタン画像をクリックしたときに同一ページ内にある画像が変わるようにしたいのですが、下のように描くと、ボタン画像（button.gif)自身が2.pngなどの画像に変わってしまいます。スワップイメージボタンを押すと下に画像が表示されます。原因を私なりに考えたところ、設定した変数mageUrlをボタンを表示させるために使ったで受け取ってしまっているというのはわかりました。（確認のためを～より上に持ってきたら思っていた動きになりました。）けれどそれからどう修正したらもとの順番でもちゃんと動くのかがわかりません。過去ログの似た質問も拝見したのですが、今の自分では理解できませんでした‥。すみませんがよろしくお願いいたします。

画像をクリックして別の画像を変えたい

解決済

質問者：magno
質問日時：2003/10/22 00:30
回答数：1件

ボタン画像をクリックしたときに同一ページ内にある画像が変わるようにしたいのですが、下のように描くと、ボタン画像（button.gif)自身が2.pngなどの画像に変わってしまいます。
　

<HTML>
<HEAD>
<TITLE>スワップイメージ</TITLE>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>

</HEAD>
<BODY>

<A HREF="#" onClick="changeImage('1.png')" ><IMG SRC="button.gif" border="0"></A>
<A HREF="#" onClick="changeImage(2.png')" ><IMG SRC="button.gif" border="0"></A>
<A HREF="#" onClick="changeImage(3.png')" ><IMG SRC="button.gif" border="0"></A>

<TABLE BORDER="0">
<TR>
<TD>ボタンを押すと下に画像が表示されます。</TD>
</TR>
<TR>
<TD><IMG SRC="1.png"></TD>
</TR>

</TABLE>

</BODY>
</HTML>

原因を私なりに考えたところ、設定した変数mageUrlをボタンを表示させるために使った<img　src="button.gif">で受け取ってしまっているというのはわかりました。（確認のため <IMG SRC="1.png"> を<A HREF>～</A>より上に持ってきたら思っていた動きになりました。）
　けれどそれからどう修正したらもとの順番でもちゃんと動くのかがわかりません。過去ログの似た質問も拝見したのですが、今の自分では理解できませんでした‥。すみませんがよろしくお願いいたします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： the845t
回答日時：2003/10/22 00:39

document.images[0].src = imageUrl;

というのは、そのページ中最初の画像をimageUrlに変えるという指示です。

そこら変が理解できると分かると思います。
余談ですが、そうした何番目の画像を変えるというのではなく、
名前なりIDを付けると、その名前なりIDの絵を変えることができるようになります。

- 0
- 件

通報する

この回答へのお礼

早速のご回答ありがとうございます。

document.images[0].src = imageUrl;の[0]を[3]に変えたらうまくいきました。
かなり初歩的な質問をしてしまいすみません。スクリプトの意味をきちんと把握せずにサンプルプログラムをかいつまんで作ってしまっていたので以後もっと内容を理解しながら使っていこうと反省しました。
また、名前やIDを使って試してみたらこちらも出来ました～。ためになるアドバイスありがとうございます！

通報する

お礼日時：2003/10/22 18:31

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！