javascript - 如何传递参数jquery并返回函数值

Question

我刚刚学习 jQuery 的诀窍，我正在尝试为一个简单的 FizzBu​​zz 游戏创建前端，我有一个函数如下...

FizzBuzz.prototype.play = function(number){
    if (this.isDivisibleByFifteen(number)) {
        return "FizzBuzz";
    }
    else if (this.isDivisibleByThree(number)) {
        return "Fizz"; 
    }
    else if (this.isDivisibleByFive(number)) {
        return "Buzz";
    }
    else {
        return number;
    }
}

我希望有一个 html 表单，除了参数 (number) 并在跨度容器内返回结果...

<form id="game">
      <input type="text" name = "text" placeholder="Type your number"/>
</form>

<span id="outcome">??</span>```

这是我到目前为止所拥有的，随意撕开......

$(document).ready(function() {
    $("#outcome").text(function() {
        fizzBuzz.play( $(this).attr("number") );
    });
});

显然，这没有考虑表单中的任何输入，但还不确定如何做到这一点。非常感谢。

Answer 1

您正在设置负载结果值。当用户提供一个值时，您需要捕获一些事件才能运行游戏，例如，由于您没有按钮，以下是在按键时执行此操作的方法:

$(document).ready(function() {
    $("#game input[name=text]").keyup(function() {
        $('#outcome').text(fizzBuzz.play( this.value ));
    });
});

或者，如果您想在用户按下回车键(即提交表单)时运行游戏:

$(document).ready(function() {
    $("#game").submit(function() {
        $('#outcome').text(fizzBuzz.play( $('input[name=text]', this).val() ));
    });
});