Javascript最小值和最大值

Question

我使用以下來限制文本字段中的值。只有當用戶試圖刪除並留空時，它纔會有效。它不會刪除最小值。 數量：

<input type="text" placeholder="none" name="notepad_and_pen" id="notepad_and_pen" maxlength="10" style="width:50px" tabindex=4 onchange="this.value = (this.value > 999999) ? 999999 : ((this.value < 400) ? 400 : this.value);"> 

我也有在標題爲空白文本字段的佔位符這個腳本也許這可能會以某種方式影響：

$('input').focus(function(){ 
    $(this).val(''); 
}).blur(function(){ 
    if($(this).val() == "") 
    { 
     $(this).val($(this).attr('placeholder')) 
    } 
} 
); 

請需要幫助。我是一個完全noob，任何你可以教導的將是偉大的。謝謝大家。

Answer 1

this.value的值是一個字符串。你將它與一個數字進行比較。在比較之前將其轉換爲一個數字，喜歡的東西：

parseFloat(this.value) 

當然，它可以更容易調試了很多，用，如果你不使用內聯事件處理工作。你已經使用jQuery，那麼試試這個：

$("#notepad_and_pen").on("change", function() { 
    var $this = $(this), 
     finalValue = $this.val(), 
     myValue = parseFloat(finalValue); 
    if (isNaN(myValue)) { 
     finalValue = ""; 
    } else { 
     if (myValue > 999999) { 
      finalValue = 999999; 
     } else if (myValue <= 0) { 
      finalValue = ""; 
     } else if (myValue < 400) { 
      finalValue = 400; 
     } 
    } 
    $this.val(finalValue); 
}); 

DEMO：上#notepad_and_penhttp://jsfiddle.net/wTKxX/4/

Answer 2

限制可以徵收，並刪除允許，用一行代碼。

This page提供了一種檢測佔位符是否本機支持（從而避免需要Modernizr）的方法。

和this page提供了一種非本地處理佔位符的合理方法。

這裏的組合代碼：

$(function() { 
    //Impose limits on #notepad_and_pen 
    $("#notepad_and_pen").on('change', function() { 
     this.value = (this.value === '') ? '' : Math.max(400, Math.min(999999, Number(this.value))); 
     //Use the following line to reject anything that's zero, blank or not a number, before applying the range limits. 
     //this.value = (!Number(this.value)) ? '' : Math.max(400, Math.min(999999, Number(this.value))); 
    }); 

    //With reference to http://diveintohtml5.info/detect.html 
    function supports_input_placeholder() { 
     var i = document.createElement('input'); 
     return 'placeholder' in i; 
    } 

    //With reference to http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html 
    // 1. Handle placeholders (in non-HTML5 compliant browsers). 
    if(!supports_input_placeholder()) { 
     $('[placeholder]').focus(function() { 
      var input = $(this); 
      if (input.val() == input.attr('placeholder')) { 
       input.val(''); 
       input.removeClass('placeholder'); 
      } 
     }).blur(function() { 
      var input = $(this); 
      if (input.val() == '' || input.val() == input.attr('placeholder')) { 
       input.addClass('placeholder'); 
       input.val(input.attr('placeholder')); 
      } 
     }).blur(); 

     //2. Prevent placeholder values being submitted to form's action script 
     $('[placeholder]').eq(0).closest('form').submit(function() { 
      $(this).find('[placeholder]').each(function() { 
       var input = $(this); 
       if (input.val() == input.attr('placeholder')) { 
        input.val(''); 
       } 
      }); 
     }); 
    } 
});