Question

我想使用HTML5 min max validation但是这段代码：

<input id='quantity' name='quantity' type='number' min='0' max='5' />

不适用于Firefox。所以我写了js脚本，但这也行不通。怎么了？

<input id='quantity' name='quantity' type='number' pattern='[1-9]*' oninput='check();'

<script language='javascript' type='text/javascript'>
function maxLength() {
    var quantity = document.getElementById('quantity');
    if (parseInt(quantity.value) > 5) {
        quantity.setCustomValidity('Alert');
    } else {
        quantity.setCustomValidity('');
    }
}
</script>

Answer 1

这里有关于ff

的工作代码

function maxLength() {
    var obj = document.getElementById('quantity');
    var max = obj.getAttribute('max');
    var min = obj.getAttribute('min');
    if (obj.value > max || obj.value < min) {
        obj.setCustomValidity('Alert ');
    } else {
        obj.setCustomValidity('');
    }
}

demo

Answer 2

您的代码按原样运行。

enter image description here

我想你忘了在文档的开头提到<!doctype html>。

Answer 3

您必须在表单标记

中编写HTML验证

<form>
   <input id='quantity' name='quantity' type='number' min='0' max='5' />
</form>

Answer 4

你可以写一个onkeydown或onkeypress事件来检查被按下的键。

document.getElementById("quantity").onkeypress = function(e){

   //for browser compatibility
   var keyCode = e.keyCode || e.charCode || e.which;
   if(keyCode<48||keyCode>53)
    {      
          //suppress the key or do whatever else you want with it
          return false;
    }

}

我没有检查过这段代码，所以不要信仰它，但这应该有所帮助。

HTML5 min max validation - firefox

4 个答案: