Javascriptでコード間違いを指摘してください（if構文で画像表示を行いたい）

if構文を使って画像の表示を行いたい
”春”と入力したら指定された画像を表示。
”夏”や”秋”も同様。

###発生している問題・エラーメッセージ
エラーは出ないのにfunction内が実行されません。
実行して画像表示を行いたい。

###該当のソースコード
<script>
function color()
{
  var a; //コップaを用意する
  var ans=document.getElementById("img");    //コップansを用意し、表示（出力）先とする
  a=window.document.myform.a.value-0;           //ボックスaに入力された数字をコップaに入れる

  if (a="春" || "Spring") {
　　ans.src="PCspring.png";
    ans.alt="spring";
  } else if (a="夏" || "Summer") {
    ans.src="PCsummer.png";
    ans.alt="summer";
  } else if (a="秋" || "Autumn") {
    ans.src="PCautumn.png";
    ans.alt="autumn";
  } else if (a="冬" || "Winter") {
    ans.src="PCwinter.png";
    ans.alt="winter";
  } else {
    ans.innerHTML="入力してください";
  }
}
</script>
</head>
<body>

<div>
<form name="myform">
入力<br>
<input name="a" type="text">
<input type="button" value="色を見てみる"
onclick="color()"></form>
<div id="img">カラーチャート（画像）が出力</div>
<img id="img" name="img" >
</body>
</html>


###試したこと
いろいろ書き替えてみましたが動かないです。。ご指摘お願いします。

###補足情報(言語/FW/ツール等のバージョンなど)
なし

x_x

2018/01/16 06:15

コメントに「ボックスaに入力された数字をコップaに入れる」とありますが、数字ではない文字列と比較しています。どうしたかったのでしょうか？

web.beginner

2018/01/16 06:18

すみません、前回作ったものを一部コピーしたため数字というのは間違いで、文字です。

kei344

2018/01/16 08:43

質問文のコードはコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

行動規範の内容に同意します

回答3件

idがかぶっています。divのほうを変えるか削除してください。

HTML
1<div>カラーチャート（画像）が出力</div>

-- 15:42 動くように追記

HTML
1<div id="ans">カラーチャート（画像）が出力</div>
2<img id="img" alt="" />

JavaScript
1function color() {
2  var img = document.getElementById("img");
3  var a = document.myform.a.value;
4  img.style.display = 'inline';
5
6  if (a === "春" || a === "Spring") {
7    img.src="PCspring.png";
8    img.alt="spring";
9  } else if (a === "夏" || a === "Summer") {
10    img.src="PCsummer.png";
11    img.alt="summer";
12  } else if (a === "秋" || a === "Autumn") {
13    img.src="PCautumn.png";
14    img.alt="autumn";
15  } else if (a === "冬" || a === "Winter") {
16    img.src="PCwinter.png";
17    img.alt="winter";
18  } else {
19    document.getElementById('ans').innerHTML = "入力してください";
20    img.style.display = 'none';
21  }
22}

switchのほうがいいかもしれません・・・

投稿2018/01/16 05:49

編集2018/01/16 06:47

x_x

総合スコア13749

web.beginner

2018/01/16 05:55

回答ありがとうございます。 <div id="img">カラーチャート（画像）が出力</div> ↓ <div>カラーチャート（画像）が出力</div> に変更したところ、ボックスに何を入力してもspringと出力されてしまいました。やはりif構文が実行されていないor間違いがあるようです。この出力部分に画像を表示したいのですが、お分かりになるでしょうか…？よろしくお願いいたします。

x_x

2018/01/16 06:01

比較は===です。 =一個だと代入になってしまいますね。 ……でもまだ問題があります

x_x

2018/01/16 06:21

-0があるため、数値になってしまっています。これも削除してみてください。

web.beginner

2018/01/16 06:29

回答ありがとうございます。画像の表示がされました！数値と認識させてしまっていたためだったのですね。あと一点、if文でその他の文字を入力した場合に、”入力してください”と表示させたいのですが、表示されない上に画像が残ってしまいます。最後のelse文が間違っているのでしょうか？

x_x

2018/01/16 06:34

ansは画像としてしまったので、divも扱うなら……。回答編集しますね。

web.beginner

2018/01/16 07:45

ありがとうございます。一度実行されましたが、その後また実行されませんでした。もう一度自分で見直してみます。

行動規範の内容に同意します

演算子全般の使い方がハチャメチャです.
=,==,||,-の使い方について再確認して下さい.
NOTE:
問題となっている部分が多すぎるため, 一つずつ問題を解決するように心がけましょう.

参考
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators

JavaScript
1function color()
2{
3var a; //コップaを用意する
4var ans=document.getElementById("img");    //コップansを用意し、表示（出力）先とする
5//a=window.document.myform.a.value-0;           //ボックスaに入力された数字をコップaに入れる
6a=window.document.myform.a.value;           //文字列に-0とするからおかしくなる
7
8if (a=="春" || a=="Spring") {
9ans.src="PCspring.png";
10ans.alt="spring";
11} else if (a=="夏" || a=="Summer") {
12ans.src="PCsummer.png";
13ans.alt="summer";
14} else if (a=="秋" || a=="Autumn") {
15ans.src="PCautumn.png";
16ans.alt="autumn";
17} else if (a=="冬" || a=="Winter") {
18ans.src="PCwinter.png";
19ans.alt="winter";
20} else {
21ans.innerHTML="入力してください";
22}
23}
24

投稿2018/01/16 05:59

編集2018/01/16 06:19

defghi1977

総合スコア4756

web.beginner

2018/01/16 06:09

回答、参考URLありがとうございます。あまりにも初心者過ぎていろいろと混乱してしまいました。ご指摘通り直したのですが、画像が表示されません…

defghi1977

2018/01/16 06:31

> あまりにも初心者過ぎていろいろと混乱してしまいました。初心者だからというのは免罪符にはなりません. わからなければ調べればいいだけの話です. また, 意味もわからずコピペでコードを継ぎ接ぎするのは下策の下策です. まずは, どのような仕組みを考え, それに対してどのようなコードを考えたか, そしてどのような結果が得られたかについて正確に相手に伝えられるようにトレーニングしましょう.

web.beginner

2018/01/16 06:37

おっしゃる通りです。とはいえ意味もわからず継ぎ接ぎしているわけではないのですが、そういった印象を与えてしまう知識のなさ、勉強不足であることに自分自身ショックでした。本質的な理解が不十分だと痛感しております。もっとしっかりと勉強します。

行動規範の内容に同意します

a="春"では代入になってしまいます。if (a=="春" || a =="Spring") としましょう（残り3つも同様に書いてください）。

投稿2018/01/16 05:58