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(''); 
       } 
      }); 
     }); 
    } 
});