二つの入力から値を取得し、それらが等しい値かそうでない場合は、出力メッセージを書くためにどのように?

ラクエルサントス:

これは私がこれまで行ってきものです。問題は、メッセージが偶数値を入力することなく、常に表示されていることです。もう一つは、あなたが異なり、これを行うのでしょうか?そうは私にあなたの例を示します。

let jogador1 = document.querySelector('#jogador1');
let jogador2 =document.querySelector('#jogador2');
let output = document.querySelector('#output');


let value1 = jogador1.value;
let value2 = jogador2.value;

let letsCompareValues = (value1, value2) => {

       if (value1 === value2 && value1 !== isNaN && value2 !==isNaN) {
           msg += ' there is a match';
           return output.textContent = msg;
       }


}

button.addEventListener('click', letsCompareValues(value1, value2));

            <div>
                <label for="jogador1">Player 1</label>
                <input type="text" id="jogador1">
            </div>
            <div>
                <label for="jogador2">Player 2</label>
                <input type="text" id="jogador2">
            </div>
            <button id="button">JOGAR</button>


palaѕn:

問題は、あなただけのようなボタンをクリックする前に値を設定しています:

let value1 = jogador1.value;
let value2 = jogador2.value;

だから、ユーザーがこれらの値を変更しても..に保存された一時値value1&はvalue2常に空になります。あなただけのボタンをクリックするだけのような内部のそれらの値にアクセスする必要があります。

let letsCompareValues = () => {
  let msg = '';
  let value1 = jogador1.value;
  let value2 = jogador2.value;
  if (value1 === value2 && !isNaN(value1) && !isNaN(value2)) {
    msg += ' there is a match';
    output.textContent = msg;
    return output.textContent;
  } else {
    output.textContent = msg;
  }
}

デモ:

let jogador1 = document.querySelector('#jogador1');
let jogador2 = document.querySelector('#jogador2');
let output = document.querySelector('#output');

let letsCompareValues = () => {
  let msg = '';
  let value1 = jogador1.value;
  let value2 = jogador2.value;
  if (value1 === value2 && !isNaN(value1) && !isNaN(value2)) {
    msg += ' there is a match';
    output.textContent = msg;
    return output.textContent;
  } else {
    output.textContent = msg;
  }
}

button.addEventListener('click', letsCompareValues);
<div>
  <label for="jogador1">Player 1</label>
  <input type="text" id="jogador1">
</div>
<div>
  <label for="jogador2">Player 2</label>
  <input type="text" id="jogador2">
</div>

<button id="button">JOGAR</button>
<div id="output">
</div>

おすすめ

転載: http://10.200.1.11:23101/article/api/json?id=399852&siteId=1