如何在iPhone上限制HTML 5数字输入字段中输入的字符数

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (75)

看来,“maxength”、“min”或“max”HTML属性对iPhone上的下列标记似乎都没有预期的效果:

 <input type="number" maxlength="2" min="0" max="99"/>

在iPhone 上输入数字时,不需要限制数字或输入数字的值,而是只留下数字。这个标记在我们测试过的大多数其他手机上都能使用。

有什么解决办法吗?

提问于
用户回答回答于

JS

function limit(element)
{
    var max_chars = 2;

    if(element.value.length > max_chars) {
        element.value = element.value.substr(0, max_chars);
    }
}

HTML

<input type="number" onkeydown="limit(this);" onkeyup="limit(this);">

如果使用jQuery,你可以稍微整理一下javascript:

JS

var max_chars = 2;

$('#input').keydown( function(e){
    if ($(this).val().length >= max_chars) { 
        $(this).val($(this).val().substr(0, max_chars));
    }
});

$('#input').keyup( function(e){
    if ($(this).val().length >= max_chars) { 
        $(this).val($(this).val().substr(0, max_chars));
    }
});

HTML

<input type="number" id="input">
用户回答回答于

根据MDNmaxlength不用于numbers。你有没有尝试过:

<input type="number" min="0" max="99" />

或者

<input type="range" min="0" max="99" />

扫码关注云+社区

领取腾讯云代金券