Борьба с игрой в угадайку - PullRequest
0 голосов
/ 12 февраля 2019

Как я могу сделать "Ты понял!"всплывающее сообщение, когда мой ввод не только 5, но ниже или равен 5?

document.getElementById("my-button").onclick = function() {
  if (document.getElementById("my-input").value == "5") {
    alert("You got it!")
  } else {
    alert("Opps, wrong number. Please try again.")
  }
}
What is my favorite numbers? 
<input type="text" id="my-input">

<button id="my-button">Submit</button>

Ответы [ 5 ]

0 голосов
/ 12 февраля 2019

Значение, которое вы получаете из типа ввода, является строкой, поэтому вам нужно преобразовать его в число с помощью методов [ ParseInt , Number ], после чего вы можете сравнить, и все настройки будут работать нормально.так что я думаю, что лучше у тебя

let button = document.getElementById("my-button");
let value = document.getElementById("my-input");
button.on('click', function () {
    if (Number(value) <= 5) {
        alert("You got it!")
    } else {
        alert("Opps, wrong number. Please try again.")
    }
});

хорошая игра

0 голосов
/ 12 февраля 2019

На самом деле, когда вы получаете доступ к значению <input>, это строка .Вы не можете использовать >,<,>=,<= между strings, вам необходимо преобразовать его в число, используя <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt" rel="nofollow noreferrer">parseInt()</a>

document.getElementById("my-button").onclick = function() {
  let value = parseInt(document.getElementById("my-input").value)
  if (value <= 5) {
    alert("You got it!")
  } else {
    alert("Opps, wrong number. Please try again.")
  }
}
What is my favorite numbers? 
<input type="text" id="my-input">

<button id="my-button">Submit</button>
0 голосов
/ 12 февраля 2019

Небольшая проблема с вашим вопросом заключается в том, что тип ввода - text, а не number.Вы можете изменить тип ввода, выполнив <input type=number id="my-input">.Если вы хотите сохранить тип, вам нужно проверить, является ли ввод числом.

В любом случае вам придется конвертировать значение ввода из строки в число, поскольку числовые операции, использующие строки, чаще всего ошибочны.времени (есть редкие конкретные случаи, когда результат один и тот же).Единственная разница между использованием текста и числа заключается в необходимости проверки правильности значения ввода, что можно сделать с помощью isNaN после преобразования.Я обычно предпочитаю заставлять JavaScript преобразовывать текст, используя - 0 вместо parseInt или parseFloat, так как он более краткий и не преобразует "123test" в 123.

Вот решение, работающее с номером

document.getElementById("my-button").addEventListener("click", function() {
  if (document.getElementById("my-input").value - 0 <= 5) {
    alert("You got it!")
  } else {
    alert("Opps, wrong number. Please try again.")
  }
});
<input type="number" id="my-input">
<button id="my-button">Submit</button>

Вот решение, работающее с текстом

document.getElementById("my-button").addEventListener("click", function() {
  var value = document.getElementById("my-input").value - 0;
  if (isNaN(value)) {
    alert("Not a number");
  } else if (value <= 5) {
    alert("You got it!")
  } else {
    alert("Opps, wrong number. Please try again.")
  }
});
<input type="text" id="my-input">
<button id="my-button">Submit</button>
0 голосов
/ 12 февраля 2019

Вы должны преобразовать свое значение в число с помощью Number, а затем сравнить его с помощью <=.

document.getElementById("my-button").onclick = function() {
  if (Number(document.getElementById("my-input").value) <= 5) {
    alert("You got it!")
  } else {
    alert("Opps, wrong number. Please try again.")
  }
}
What is my favorite numbers? 
<input type="text" id="my-input">

<button id="my-button">Submit</button>
0 голосов
/ 12 февраля 2019

Вам необходимо преобразовать входное значение, которое является строкой, в число перед сравнением.

В этом случае вы можете использовать parseInt

document.getElementById("my-button").onclick = function() {
  if (parseInt(document.getElementById("my-input").value, 10) <= 5) {
    alert("You got it!")
  } else {
    alert("Opps, wrong number. Please try again.")
  }
}
What is my favorite numbers?
<input type="text" id="my-input">
<button id="my-button">Submit</button>
...