1

这是我关于堆栈溢出的第一个问题，我只编码了几个月，我知道我可能只是在这里遗漏了一些简单的东西。我正在尝试创建一个用于学习目的的简单程序，计算机自动选择 1-100 之间的数字，然后用户选择数字，如果他们的选择相对于计算机号码是热的还是冷的，就会收到警报。

我试图将表单字段中的用户答案传递给 JavaScript 变量，然后在单击按钮时运行该函数来测试他们的答案。我对这两个都使用 jQuery。

这是实时应用程序：http: //keithlamar.github.io/HotOrCold/

这是我的 HTML：

<form>
   Your Number <input id="guess" type="number" name="yournumber"><br>
</form>
   <p id="pick">Click Here</p>

这是我的 JavaScript：

var userNum = $('#guess').val();
var comNum = Math.floor(Math.random()*101);
var difference = function (a,b) {return Math.abs(a - b)};
var askNumber = function(){
    if(userNum == comNum){
        alert("You got it! You Win!")
    }
    else if(difference(userNum,comNum) < 5){
        alert("Very Hot!"); 
    }
    else if(difference(userNum,comNum) < 10){
        alert("Hot!");  
    }
    else if(difference(userNum,comNum) < 20){
        alert("Warm!"); 
    }
    else if(difference(userNum,comNum) > 20){
        alert("Very Cold!")         
    }
    else {
        alert("Sorry, you need to choose a number.")    
    }

};
$(document).ready(function(){

    $('#pick').click(function(){
    askNumber();
    });

});

似乎var userNum没有从输入中获得价值。我认为这可能与函数内的函数嵌套有关，但我不完全确定！

感谢您的任何意见！

4

1 回答 1

1

您需要读取函数内部的值 - 在您的代码中，您正在页面加载期间读取输入字段（在点击发生之前）

function difference(a, b) {
    return Math.abs(a - b)
};

function askNumber() {
    //read the user input in the click handler
    var userNum = parseInt($('#guess').val(), 10);

    var comNum = Math.floor(Math.random() * 101);

    //calculate the difference only once then reuse it
    var diff = difference(userNum, comNum);
    if (diff == 0) {
        alert("You got it! You Win!")
    } else if (diff < 5) {
        alert("Very Hot!");
    } else if (diff < 10) {
        alert("Hot!");
    } else if (diff < 20) {
        alert("Warm!");
    } else if (diff > 20) {
        alert("Very Cold!")
    } else {
        alert("Sorry, you need to choose a number.")
    }

};
$(document).ready(function () {

    $('#pick').click(function () {
        askNumber();
    });

});

演示：小提琴

于 2013-10-16T03:44:42.267 回答