![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
お世話になります。
自分なりにやってみたのですが、エラーが解決できないため、知恵を貸してください。
やりたいことは、「あるリンク画像を押すと、画像が切り替わり(オン)、押されなかった画像はデフォルト画像に戻る(オフ)」ということです。
ソース
OnBar = new Array();
OnBar[0] = "On_1.gif";
OnBar[1] = "On_2.gif";
OffBar = new Array();
OffBar[0] = "Off_1.gif";
OffBar[1] = "Off_2.gif";
imgOn = new Array();
imgOff = new Array();
for ( i=0; i<2; i++ ){
var imgOn[i] = new Image();
var imgOff[i] = new Image();
}
//画像の割り当て
function fncPreLoad(){
for ( i=0; i<2; i++ )
imgOn[i].src = OnBar[i];
imgOff[i].src = OffBar[i];
}
//画像変更
function fncChangeBar(Cnt){
for ( i=0; i<23; i++ )
if ( i = Cnt ){
document.images[Cnt].src = imgOn[i];
} else {
document.images[Cnt].src = imgOff[i];
}
}
<body onLoad="fncPreLoad()">
<img src="Off_2.gif" onclick="fncChangeBar(0)" name="images0">
これで実行するとまず、fncPreLoadで「;」がありませんでエラーが出て、onClickイベントで「オブジェクトがありません」でエラーが出てしまいます。
どなたか添削してやってください。
お願いいたします。
No.3ベストアンサー
- 回答日時:
> forのかっこは入れてもエラーが出たので、「入れないのかな?」と勝手に思って入れてません。
これは入れないとダメです。
function fncPreLoad() {
for ( i=0; i<2; i++ ) {
imgOn[i].src = OnBar[i];
imgOff[i].src = OffBar[i];
}
}
function fncChangeBar(Cnt) {
for ( i=0; i<23; i++ ) {
if ( i = Cnt ){
document.images[Cnt].src = imgOn[i];
} else {
document.images[Cnt].src = imgOff[i];
}
}
}
それともう1つ。
for ( i=0; i<2; i++ ){
var imgOn[i] = new Image();
var imgOff[i] = new Image();
}
のvarも違反ですので、取ってください。
付けるなら、
OnBar = new Array();
OffBar = new Array();
imgOn = new Array();
imgOff = new Array();
の行に付けます。
それから、これは文法違反ではありませんが、
if ( i = Cnt ){
では、iにCntを代入してしまいます。
等しいか調べるには、
if ( i == Cnt ){
とします。
多分こんな感じではないでしょうか。
ありがとうございます。
何でループしてたかわかりました。
代入していては終了条件になりませんね。
何とか動作してくれたのですが、画像を変更してくれないので、もう少しがんばってみます。
本当にありがとうございました。
No.2
- 回答日時:
こんにちはcat_tomatoさん、xruzです。
var imgOn = new Array();
var imgOff = new Array();
for ( i=0; i<2; i++ ){
imgOn[i] = new Image();
imgOff[i] = new Image();
}
varをつけるならこうしましょうね。
function fncPreLoad(){
for ( i=0; i<2; i++ ) {
imgOn[i].src = OnBar[i];
imgOff[i].src = OffBar[i];
}
}
ここはやっぱり{}が要りますよ。
がんばってくださいね(~:~i
ありがとうございます。
やっぱりかっこは入りました。
どうやらvarがいらなかったってところまでは気づきました。
今度はonClickイベントでループしてしまうようです。
はぁ、問題山積みですが、がんばってみます。
本当にありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- PHP imageフォルダに、画像をリサイズして保存する時のファイル名を変更したい 1 2023/05/30 11:39
- HTML・CSS 【HTML】【CSS】【Swiper】 元の画像は横1200×縦600なのですが、実際のサイト上に反 5 2022/07/16 13:57
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- JavaScript GoogleChart 階層ごとのブロックの長さを個別に設定したい 1 2022/07/06 14:27
- HTML・CSS ブロックエディターで作りつつ、画像を挿入しつつ、画像にスタイルシートのコードを付ける方法はありますか 1 2022/08/23 18:46
- PHP jpgraphで表示されない 2 2022/10/22 09:12
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
【javascript】ロールオーバー...
-
一定時間ごとにgif画像の切...
-
window.openで値の渡し方を教え...
-
画像と文字を同時に切り替えたい
-
前回の質問の続き
-
MAX関数を使ってからLEFT JOIN...
-
jspでcssが読み込めない
-
1枚の画像をクリックすると複数...
-
フッター上部に謎の隙間
-
iframe内のリンクが飛ばないの...
-
MFCで画像を表示させているので...
-
表示・非表示のスクリプトで、...
-
getElementByIdの戻り値がnull...
-
appendChildでのデフォルト値
-
[jQuery]bxSlider 一番最後と...
-
iframe内のリンク文字のマウス...
-
jQueryでのドラッグアンドドロ...
-
bxsliderで最初に縦に複数表示...
-
指定したフォルダの画像を一括...
-
JavaScript で flexslider の画...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
window.openで値の渡し方を教え...
-
this.src等のthisについて
-
imgのsrcに値を設定するには
-
jQueryでサーバー上のファイル...
-
画像の座標位置取得
-
イベントハンドラを完全に外部...
-
連番画像「次へ」「前へ」で、...
-
画像の下に説明文をつけて切り...
-
JS switch文について
-
JavaScriptでリクエストを飛ば...
-
スマートな外部javaでロールオ...
-
JavaScriptでシンプルなスライ...
-
一定時間で画像とリンク先を変...
-
javascript 時計24時間表示
-
画像と文字を同時に切り替えたい
-
これはどんなJavaScriptなので...
-
Javaにて画像を残像が残りつつ...
-
FirefoxでonMouseOver/Outの動...
-
divの背景画像を、徐々に表示さ...
-
時間によって表示される画像を...
おすすめ情報