Question

所以我有一个input[type="number"]（最好有一个pattern="[0-9]*"属性来调出iOS中的正确键盘（iPhone，在iPad上不起作用））

当我以编程方式更新价值时，iOS将其搞砸，Android拒绝完全合作。

我在这里有一个小测试用例：http://jsfiddle.net/9QUPe/

基本上，键盘（至少在iOS上）不会给你一个小数位，所以我想为用户添加。

$('input').on('keyup', function(){
    var val = this.value.replace('.','');
    if(val.length <= 2){
        this.value = '.'+val
    }else{
        this.value = val.slice(0,-2) +'.'+ val.slice(-2);
    }
});

完美适用于Chrome（Win7） - 但iOS不接受零（即使数据保存为字符串），Android也会完全清空输入（无论pattern属性是否存在（有关此测试用例，请参阅Android上的http://jsfiddle.net/9QUPe/1）。）。

有关如何使其发挥作用的任何想法？

Answer 1

我认为我可以用提供类似键盘的input type="number"取代input type="tel"，并且可以在iOS / Android上正常使用 - 但会带来额外的字符，+ +＃ - （）N ...

因此，我提出的解决方案是使用type="tel"并删除那些额外的字符。

$('input').on('keyup change', function() {
    var val = this.value;
    val = val.replace(/\D/g, '');

    if (val.length <= 2) {
        this.value = '.' + val;
    } else {
        this.value = val.slice(0, -2) + '.' + val.slice(-2);
    }
});

（见http://jsfiddle.net/9QUPe/9/）

移动输入无法以编程方式更新

1 个答案: