こんにちわ。
今、フレームを用いてホームページを作成しています。
そのなかでJavascriptを用いて複数のフレームを同時に変更しようとしているのですが、
上手く出来ません。Javascriptの参考書等を見るとフォームボタンをクリックした時に
複数のページを変更する方法はよく載っているのですが、gifの画像をクリックした時に
複数のページを同時に変更したいのです。
ご存知の方がいらっしゃいましたらご返答をお願いします。
ちなみに、参考書等に載っていたフォームボタンをクリックする場合の方法を書いておきます。
フレーム名はf1,f2,f3としていて、f1内のフォームボタンをクリックするとf2,f3が変更される
ものが載っていたのでその中のf1を書いておきました。
よろしくお願いします。
<HTML>
<HEAD>
<TITLE>F1.HTM</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function ChangFram(P1,P2){
parent.f2.location.href=P1
parent.f3.location.href=P2
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="CHANG">
<INPUT TYPE="button" NAME= "chang1" VALUE=" Change!! " onClick="ChangFram('FP2.HTM','FP3.HTM')">
<P>
<INPUT TYPE="button" NAME= "chang2" VALUE=" 元に戻す " onClick="ChangFram('F2.HTM','FP1.HTM')">
</FORM>
</BODY>
</HTML>
No.3ベストアンサー
- 回答日時:
<img>タグや<a>タグで「onClick」を使用するのではなく、
<a href="javascript:ChangFram('FP2.HTM','FP3.HTM')"><img src="1.gif"></a>
<p>
<a href="javascript:ChangFram('F2.HTM','FP1.HTM')"><img src="2.gif"></a>
とすれば良いと思いますよ。
出来ました。
NO.2の方法でもNO.3の方法でも出来ました。
というより、両方とも試していたのですが出来なかったのです。
原因は違う個所だったようです。FRAMEのNAME内に-(ハイフン)を使用していたのですが、それを外したら出来るようになりました。
NAMEに使える文字にも制限があるのですね。
お答え下さった方、有難うございました&すみませんでした。
No.2
- 回答日時:
古いブラウザ(NN4.x とか、IE4 とか)だと、<img> に onClick ハンドラがありません。
リンクにすればいけます。
<a href="#" onClick="ChangFram('FP2.HTM','FP3.HTM')"><img src=1.gif></a>
<p>
<a href="#" onClick="ChangFram('F2.HTM','FP1.HTM')"><img src=2.gif></a>
って感じ。リンクなので、フォームの中に書く必要はありません。
No.1
- 回答日時:
先ほど少しだけ試してみたのですが、画像、つまり<img>タグに対してもonClickのイベントはかけるはずですし、きちんと実行するはずですよね。
ですのでボタンをクリックするのと何ら変わりは内科と思います。
指定するフレームの名前は間違いありませんか?
変更先のURLも間違いはありませんか?
さらに、私が昔悩んだことがあるのは、<script>タグを書く位置です。
常に<head>~</head>に書かなければいけないわけではないので、実行順とかをよく考えてやってみてはどうでしょうか?
参考になるかどうかはわかりませんが、がんばってみてください。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
- ・ゆるやかでぃべーと タイムマシンを破壊すべきか。
- ・歩いた自慢大会
- ・許せない心理テスト
- ・字面がカッコいい英単語
- ・これ何て呼びますか Part2
- ・人生で一番思い出に残ってる靴
- ・ゆるやかでぃべーと すべての高校生はアルバイトをするべきだ。
- ・初めて自分の家と他人の家が違う、と意識した時
- ・単二電池
- ・チョコミントアイス
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
複数画像のランダム複数表示(...
-
外部javascriptの重複を防ぐには
-
複数の画像をフェードイン・ア...
-
nodejsの画像表示は特別なこと...
-
dtで横並び
-
画像が表示でnull; this.src
-
以下のタグはクリックすると画...
-
【OpenCV】二値画像後、白の部...
-
OpenCVでの画像からの顔検出
-
MFCで画像を表示させているので...
-
javaScriptでリンク画像のラン...
-
MAX関数を使ってからLEFT JOIN...
-
iframe内のリンクが飛ばないの...
-
jqueryで要素の中身を要素の外...
-
変数内容をHTML内で表示する方法
-
c++std::string型をTCHARに変換...
-
removeEventListenerについて
-
CSS <div>の入れ子が反映さ...
-
JSPでの画像ファイル表示
-
フッター上部に謎の隙間
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
JavaScriptで変更した属性の元...
-
画像が表示でnull; this.src
-
外部javascriptの重複を防ぐには
-
libjpegライブラリの使い方につ...
-
MFCで画像を表示させているので...
-
条件分岐でキーが入力されてい...
-
【OpenCV】二値画像後、白の部...
-
外部ファイルにしたら文字化け...
-
error LNK2019 未解決のシンボ...
-
jqueryスライドショーをストッ...
-
Vb.net2005での画像の合成方法
-
複数の画像をフェードイン・ア...
-
複数画像のランダム複数表示(...
-
ラズパイでno module named zbar
-
OpenCV 2値化について
-
リンク先を動的に変更する
-
HTMLからimgのsrcのみを正規表...
-
nodejsの画像表示は特別なこと...
-
jqueryのスライドショー。html...
-
onclickで画面が固まる・・・ら...
おすすめ情報