我想要的文本框不顯示大於最大

Question

可能重複更高的數：
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()); 
}); 

在改變它會從什麼類型的最小值，什麼是在其他領域。當您離開（選項卡或點擊）字段時觸發更改事件。如果您希望它發生，因爲用戶使用keyup()而不是change()。

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

您可能需要添加一些驗證所輸入的數值實際上是一個數字。我上面的代碼使用一元+運算符將字符串值轉換爲數字，這並不是真的必要，因爲（我很確定）Math.min函數會爲您轉換，但請注意，如果其中一個值無法轉換。

注：您的jsfiddle有嵌套在另一個文件準備處理的文檔準備好處理程序：

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

雖然它的工作原理有一個以上的那裏，除非他們是在單獨的JS文件是沒有多大意義，而且也嵌套它們沒有意義。

Answer 2

使用jQuery，只是做了這樣的代碼;

$(document).ready(function() { 
    $("#mytextbox").change(function() { 
     var max = $("#mybutton").val(); 
     var number = $("#mytextbox").val(); 
     if(number > max) { 
       $("#mytextbox").val(max); 
     } 
    }); 
}); 

凡mytextbox是答案的數量和則myButton是場你的文本框，如果由用戶選擇的號碼;

Answer 3

http://jsfiddle.net/aMmNL/3/

就在這個代碼添加到document.ready事件處理程序：

$('#numberAnswerTxt').bind('keyup', function() { 

    //get the integer value of the `#gridTxt` input 
    var gridTxt = parseInt($('#gridTxt').val().replace(/[^0-9\.]+/g, '')); 

    //if `#gridTxt`'s value has been set then limit this input's value to `#gridTxt`'s value 
    if (gridTxt > 0) { 
     this.value = parseInt(this.value.replace(/[^0-9\.]+/g, '')); 
     if (this.value > gridTxt) { 
      this.value = gridTxt; 
     } 

    //otherwise if no value has been set for `#gridTxt` then reset the value of this input 
    } else { 
     this.value = ''; 
    } 
}); 

Answer 4

這是一個非常簡單的解決辦法之前我工作我看到其他的答案被張貼。無論如何，這是它。

$('#numberAnswerTxt').keyup(function(event) { 
    var theval = $('#gridTxt').val(); 
    if (parseInt(theval) && !(this.value <= theval)) { 
     this.value = theval; 
    } 
}); 

編輯：

也許這將是更好地說明多重事件（如平變化如其他人所說的）：

// onChange and onKeyUp now fire the same event handler 
$('#numberAnswerTxt').bind('keyup change', function(event) { 
    var theval = $('#gridTxt').val(); 
    if (parseInt(theval) && !(this.value <= theval)) { 
     this.value = theval; 
    } 
});