数字を判定するhtml

3 つ数字を入力し、[判定]を押すと、3つの数字のうち同じ数字がいくつあるかを表示する HTML を作っているのですがほぼ完成しているのですが2パターンだけうまく表示されませんでした。3つとも同じ場合もうまくいかずどこが間違っているのかわかりません教えてください。さらに上２つのボックスだけの時と3つ別の時もうまくいきませんでした。

html
1    <script>
2      function judge() {
3        var x, y, z;
4        var res=document.getElementById("result");
5        x=window.document.myform.s.value-0;
6        y=window.document.myform.t.value-0;
7        z=window.document.myform.t.value-0;
8
9if (x==y==z) {
10  res.innerHTML="3つとも同じです";
11}else if ((x==y)&&!(x==z)&&!(y==z)) {
12    res.innerHTML="同じ数字の数は2つです";
13}else if ((y==z)&&!(x==y)&&!(x==z)) {
14  res.innerHTML="同じ数字の数は2つです";
15}else if ((z==x)&&!(x==y)&&!(x==y)) {
16  res.innerHTML="同じ数字の数は2つです";
17}else{
18  res.innerHTML="同じ数字は１つもありません";
19}
20      }
21    </script>
22  </head>
23  <body>
24    <p>3つの数字のうち同じ数字の数を調べる</p>
25    <p>
26    <form name="myform">
27      数字1:<input type="text" name="s"><br>
28      数字2: <input type="text" name="t"><br>
29      数字3:<input type="text" name="u"><br>
30      <br>
31      <input type="button" value="判定" onclick="judge()">
32    </form>
33  </p>
34  <div id="result">ここに結果が出力されます</div>
35  </body></html>

追記　x==y==zができると思っていました。このサイトを使ったの今日が初めてなのでよくわかりませんすいません。

m.ts10806

2019/01/10 06:20 編集

x==y==z ↑このような書き方ができるというのは何を参照されたのでしょうか。以前も別の方が質問で指摘されいたような。

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

回答2件

javascript
1if (x==y==z)

こう書くと、「x==yの比較結果（true/false）がzと等しい」という意味になってしまいます。(x == y) && (y == z)と、2つの判定を並べてください。

投稿2019/01/10 06:21

maisumakun

総合スコア145183

ベストアンサー

原因のもう一つはここですね。

JavaScript
1// ふむふむxがsで、yがtね……
2x=window.document.myform.s.value-0;
3y=window.document.myform.t.value-0;
4
5// zもtの情報読みにいってるじゃないか！uでしょ！
6z=window.document.myform.t.value-0;

これは動きはするけどダメです。

JavaScript
1// 言いたいことは分かるけどだめ
2!(x==y)
3
4// こうすれば異なる数値である事を証明したいことが一目で分かる
5(x!=y)

今回の件はinput対象の項目が増えたらコピペだらけになるので、
上手くまとめて一撃で書きたいところですね。

Objectのキーで管理するのが分かりやすいですかね。
質問文のコードの共通部分を抜き出してまとめると、だいたい下記のようなコードになります。

JavaScript
1function judge() {
2  var inputList = {}:
3  for (var key of ['s', 't', 'u']) {
4    var num = window.document.myform[key].value;
5    if (!inputList[num]) inputList[num] = 0;
6    inputList[num]++;
7  }
8  var max = Math.max.apply(null, Object.values(inputList));
9  document.getElementById("result").innerHTML = `同じ数字の数は${max}つです`;
10}