如何通过javascript或jquery设置html5中<input>的最大值和最小值

use*_*363 37 html javascript jquery

我试图找出如何通过javascript或jquery设置html5类型输入的最大值和最小值.

<input type="number" max="???" min="???" step="0.5"/>
Run Code Online (Sandbox Code Playgroud)

有人请指导

nnn*_*nnn 42

jQuery可以轻松设置元素的任何属性 - 只需使用.attr()方法:

$(document).ready(function() {
    $("input").attr({
       "max" : 10,        // substitute your own
       "min" : 2          // values (or variables) here
    });
});
Run Code Online (Sandbox Code Playgroud)

如果脚本块出现在要操作的元素之后,则不需要文档就绪处理程序.

使用选择器"input"将设置所有输入的属性,所以实际上你应该有一些方法来识别有问题的输入.如果你给它一个id,你可以说:

$("#idHere").attr(...
Run Code Online (Sandbox Code Playgroud)

......或与班级:

$(".classHere").attr(...
Run Code Online (Sandbox Code Playgroud)


Dha*_*dva 15

试试这个:

<input type="number" max="???" min="???" step="0.5" id="myInput"/>

$("#myInput").attr({
   "max" : 10,
   "min" : 2
});
Run Code Online (Sandbox Code Playgroud)

注意:这将仅将最大值和最小值设置为单个输入


Ami*_*mit 10

试试这个

 $(function(){
   $("input[type='number']").prop('min',1);
   $("input[type='number']").prop('max',10);
});
Run Code Online (Sandbox Code Playgroud)

演示

  • 扩展这个答案,您可能需要包含一个函数,以便在用户输入的值超出限制时将输入重置为最大/最小值。我为自己的应用程序编写了这个 jQuery: ```$('input[type="number"]').on('keyup', function(){ if ($(this).val() &gt; $(this ).attr('max')*1) { $(this).val($(this).attr('max')); } });``` (2认同)