爲什麼<input type =「number」maxlength =「3」>在Safari中不工作？

我喜歡有最多3個字符的輸入。在Firefox中，一切正常，我只能在輸入內寫入3個數字 - 但在Safari中，您可以在其中編寫大量數字。爲什麼<input type =「number」maxlength =「3」>在Safari中不工作？

您可以用這兩種瀏覽器測試：http://flowplayer.org/tools/demos/validator/custom-validators.htm

現在我有驗證插件實現它 - 但只是爲了利益，我想知道爲什麼不是這方面的工作？

編輯：

這個它的工作

<input class="required" id="field" type="text" maxlength="3" pattern="([0-9]|[0-9]|[0-9])" name="cvv"/>

答案：How can I prevent letters inside a text element?

來源

2012-02-20 Jules

什麼可以用的是屬性'max'和'min'。看到http://stackoverflow.com/questions/8354975/how-to-add-maxlength-for-html5-input-type-number-element – Marwelln 2012-02-20 12:41:34

這是奇怪的最大和最小也不工作！？ – Jules 2012-02-20 13:13:51

我已經做到了：

<input class="required" id="field" type="text" maxlength="3" pattern="([0-9]|[0-9]|[0-9])" name="cvv"/>

，然後在我的JavaScript防止信件：

$("#myField").keyup(function() { 
    $("#myField").val(this.value.match(/[0-9]*/)); 
});

來源

2012-02-21 06:56:35 Jules

我認爲你可以在你的模式中使用'[0-9] {3}'而不是'[0-9] [0-9] [0-9]'（我知道它適用於Chrome至少）。 – Seeven 2014-09-16 10:24:33

這在iOS中很不錯，但在android上鍵盤仍然顯示爲文本，而不是數字。 – lizlux 2015-04-09 23:39:46

@lizlux添加屬性'inputmode = numeric' – OdraEncoded 2015-08-19 15:57:44

基本上最大和民屬性不會在Safari瀏覽器的支持呢。我在語法中看不到任何缺陷。你使用Safari 1.3+版本嗎？或低於？因爲最大長度財產從safari 1.3+支持。

來源

2012-02-21 05:28:18 smhnkmr

謝謝:)我正在使用Safari 1.5.2。我意識到它就像是在下面： – Jules 2012-02-21 06:58:15

我以前非常相似，@Jules答案的東西，除了他將不允許使用Shift + Home鍵。由於我們正在驗證在密鑰功能中使用的isNaN。

$("#myField").keyup(function() { 
    var e = $("#myField"); 
    if(isNaN(e.val())){ 
     e.val(e.val().match(/[0-9]*/)); 
    } 
});

與...

<input id="#myField" inputmode="numeric" maxlength="3" pattern="([0-9]{3})" type="text" />

來源

2016-03-16 21:29:01

您可以嘗試用戶類型= 「text」和oninput如下。這將只讓數字。

<input type="text" maxlength="3" oninput="this.value=this.value.replace(/[^0-9]/g,'');" id="myId"/>

來源

2016-11-24 16:31:45

這是一個更簡單的解決方案。對我來說，它的工作

<input type="number" id="cvv"> 


$("#cvv").on("keypress", function(evt) { 
    var keycode = evt.charCode || evt.keyCode; 
    if (keycode == 46 || this.value.length==3) { 
    return false; 
    } 
});

JS塊將阻止「。」（點），所以一個不能輸入浮動。我們將輸入類型保存爲數字，因此它僅作爲輸入數字。如果值長度是3，那麼它將返回false，所以輸入長度也受到限制。

來源

2017-03-27 11:58:47

-1

https://jsfiddle.net/zxqy609v/8/

function fixMaxlength(inputNumber) { 
    var maxlength = $(inputNumber).attr("maxlength"); 
    $(inputNumber).keyup(function (evt) { 
    this.value = this.value.substring(0, maxlength); 
    this.value = this.value.replace(/\D/g, ''); 
    }); 
}

來源

2017-05-12 02:34:01 jwang

使用的onkeydown長度可以限制

<input type="number" onKeyDown="if(this.value.length==10 && event.keyCode!=8) return false;">

編碼快樂:)

來源

2017-12-27 13:17:29

爲什麼<input type =「number」maxlength =「3」>在Safari中不工作？

回答

相關問題