提醒输入类型编号的值

Question

这是我遇到问题的代码。 在它下面，我将添加一个解释：

 $(function() { var $input = $("#input"); var input = $input.val(); var $go = $("#go"); $go.click(function() { alert(input); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <main> <input type="number" id="input"> <button type="button" id="go">GO!</button> </main> 

上面的代码是一个哑巴示例，代表了我的实际问题，不需要更多背景知识。

因此，我有一个input type="number" id="input"在其中输入数字，还有一个button type="button" id="go" 。

在我的jQuery中，我首先声明$input保存元素#input ，然后input保存元素#input的值，最后$go保存元素#go 。

在它下面有一个函数，表示当我单击#go ，我应该能够alert(input) 。

现在，此代码不执行此操作。 在我看来，这是很合理的，但显然是行不通的。

Answer 1

这是因为您在click函数外部声明了input ，这意味着该值（仅是一个空字符串）是在运行时设置的，不会被更新。 您应该在点击事件处理程序中定义input ：

 $(function() { var $input = $("#input"); var $go = $("#go"); $go.click(function() { var input = $input.val(); alert(input); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <main> <input type="number" id="input"> <button type="button" id="go">GO!</button> </main> 

Answer 2

首先，StackOverflow似乎阻止了来自代码段的警报，将警报输出到控制台会更加容易，因此您可以跟踪事件。

您的代码可以简化下来，不需要很多变量。

但你的主要问题是事实，即输入值没有得到复位，当点击事件发生，但渐渐拾起在页面加载，这意味着它将在卡住'' 。

 $(function() { $("#go").click(function() { var input = $("#input").val(); console.log(input); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <main> <input type="number" id="input"> <button type="button" id="go">GO!</button> </main>