使用jquery在html5中動態更改`max`或`min`

Question

我在<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並在bar上輸入1，則ext上的值不得大於2。

謝謝

Answer 1

正如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>

Answer 2

我假設您要將三個輸入的任意組合的總和限制為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>

使用jquery在html5中動態更改`max`或`min`

問題描述

2 個解決方案

解決方案1
0 2016-12-08 02:08:37

解決方案2
0 2016-12-08 02:28:19

使用jquery在html5中動態更改`max`或`min`

問題描述

2 個解決方案

解決方案1 0 2016-12-08 02:08:37

解決方案2 0 2016-12-08 02:28:19

解決方案1
0 2016-12-08 02:08:37

解決方案2
0 2016-12-08 02:28:19