我在<input type='number'>
中更改max
有问题。 这是我的示例代码:
$(document).ready(function(){
var total = 5;
$(.foo).attr('max', total);
$(.bar).attr('max', total);
$(.ext).attr('max', total);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<input type='number' name='foo' class='foo'>
<br>
<input type='number' name='bar' class='bar'>
<br>
<input type='number' name='ext' class='ext'>
</body>
如何使max
一定不是>总的?
示例:如果我在 foo 上输入 2,在柱线上输入 1,则 ext 上的 ext 不得大于 2
。谢谢
正如 Chris 在评论中提到的,它应该是'.foo'
而不是.foo
。同样作为速记,您可以将它们放在一个语句中,如下所示,$('.foo, .bar, .ext')
如果它们都具有相同的max
。
$(document).ready(function(){
var total = 5;
$('.foo, .bar, .ext').attr('max', total);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<form action="http://stackoverflow.com">
<input type='number' name='foo' class='foo'>
<br>
<input type='number' name='bar' class='bar'>
<br>
<input type='number' name='ext' class='ext'>
<br>
<input type='submit' value='Submit' >
</form>
</body>
我假设您想将三个输入的任意组合的总和限制为 5。 这是一种方法:
$(document).ready(function(){
var total = 5;
var remain;
var $foo = $("#foo");
var $bar = $("#bar");
var $ext = $("#ext");
recalculateMax = function(el)
{
switch (el) {
case $foo[0]:
remain = total - $bar.val() - $ext.val();
remain = remain < 0 ? 0 : remain
$foo.val(($foo.val() <= remain) ? $foo.val() : remain);
break;
case $bar[0]:
remain = total - $foo.val() - $ext.val();
remain = remain < 0 ? 0 : remain
$bar.val(($bar.val() <= remain) ? $bar.val() : remain);
break;
case $ext[0]:
remain = total - $foo.val() - $bar.val();
remain = remain < 0 ? 0 : remain
$ext.val(($ext.val() <= remain) ? $ext.val() : remain);
break;
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<input id="foo" type='number' name='foo' onChange="recalculateMax(this)">
<br>
<input id="bar" type='number' name='bar' onChange="recalculateMax(this)">
<br>
<input id="ext" type='number' name='ext' onChange="recalculateMax(this)">
</body>