用做一个小数字猜谜游戏挣扎

问题描述 投票:0回答:5

我怎样才能让“你猜对了!”消息弹出时,我的投入不仅是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>
javascript numbers
5个回答
1
投票

你有你的值转换为使用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
投票

您需要输入的值是一个字符串到数字比较之前转换。

在这种情况下,你可以使用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>

0
投票

,美来自输入型得到的值是字符串,这样你们需要将它转换与[ParseIntNumber]方法后,ü可以比较和everytings将正常工作,所以我认为这是U型更好地编号

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
投票

你的问题有轻微的问题是,输入的类型是text而非number。您可以通过执行<input type=number id="my-input">改变输入的类型。如果你想保持的类型,你将不得不检查,如果输入的是一个数字。

在这两种情况下,你必须将输入的值从字符串转换为数字,因为使用字符串是错误的大部分时间(也有罕见的特殊情况下,结果是一样的)数字运算。使用文本和数量不必检查输入的值是有效的,你可以使用转换后isNaN做的唯一区别。我通常喜欢迫使JavaScript的使用- 0parseIntparseFloat将文本转换,因为它是scricter并不会转换"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
投票

其实,当你访问<input>它的字符串值。不能使用>,<,>=,<=之间strings您使用需要将其转换成用数字parseInt()

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>
© www.soinside.com 2019 - 2024. All rights reserved.