jquery - 我希望文本框不显示高于最大值的数字

Question

这个问题已经有答案了:

已关闭 11 年前。

Possible Duplicate:
How to impose maxlength on textArea in HTML using JavaScript

我有一个按钮网格，用户可以在其中选择一个按钮。让我们忽略按钮“True or False”和“Yes or No”，其他按钮从“3”到“26”。现在有一个文本框( #numberAnswerTxt )，用户可以在其中选择用户想要的答案数量。现在我想做的是用户不能在文本框中输入的数字超过按钮的选项数量。

例如，如果用户从网格中选择按钮“3”，则在文本框中，用户只能输入数字 3 作为文本框中的最大数字，如果用户输入更高的数字那么文本框应该自动将数字更改为最大数字“3”。

另一个例子是，如果用户从网格中选择按钮“21”，则在文本框中用户只能输入数字 21 作为文本框中的最大数字，如果用户输入更高的数字，则文本框应自动将数字更改为最大数字“21”。

有人知道怎么做吗？

代码在jsfiddle中，点击here

谢谢

Answer 1

类似这样的事情应该可以做到:

// inside your document ready handler:

$("#numberAnswerTxt").change(function(e){
   this.value = Math.min(+this.value, +$("#gridTxt").val());
});

更改时，它将采用输入内容和其他字段中内容的最小值。当您离开(按 Tab 键或单击)该字段时，将触发更改事件。如果您希望它在用户键入时发生，请使用 keyup() 而不是 change()。

演示:http://jsfiddle.net/aMmNL/1/

您可能需要添加一些验证，以确保输入的值实际上是数字。我上面的代码使用一元 + 运算符将字符串值转换为数字，这并不是真正必要的，因为(我很确定)Math.min 函数会为您进行转换，但请注意，如果其中之一，它将返回 NaN值无法转换。

注意:您的 jsfiddle 有一个文档就绪处理程序嵌套在另一个文档就绪处理程序中:

$(document).ready(function () { /* your code here */ });
// is equivalent to
$(function() { /* your code here */ });

尽管拥有多个也没有什么意义，除非它们位于单独的 JS 文件中，而且嵌套它们也没有意义。