perché <input type = "number" maxlength = "3"> non funziona in Safari?

Question

Mi piace avere un input con un massimo di 3 caratteri. In Firefox tutto funziona bene, posso solo scrivere 3 numeri all'interno dell'input, ma in Safari puoi scrivere un sacco di numeri all'interno.

È possibile provarlo in entrambi i browser con questo: http://flowplayer.org/tools/demos/validator/custom-validators.htm

Per ora ho capito che con un plugin validate - ma solo per l'interesse che mi piace sapere perché non è questo lavoro?

EDIT:

con questo si sta lavorando

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

risposta: How can I prevent letters inside a text element?

Answer 1

che ho realizzato con:

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

e poi in JavaScript ho impedito le lettere:

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

Answer 2

Fondamentalmente Max e Min proprietà non sono supportate in browser Safari ancora. Non vedo difetti nella sintassi. Stai usando la versione 1.3+ di Safari? o sotto? Perché la proprietà lunghezza massima è supportata da Safari 1.3+.

Answer 3

ho usato qualcosa di molto simile a @Jules risposta se non il suo non consentirà la uso di tasti come shift + home. Dal momento che stiamo convalidando i numeri che ho appena usato isNaN nella funzione keyup.

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

Con ...

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

Answer 4

si può tentare di tipo utente = "text" e oninput come di seguito. Questo lascerà solo i numeri.

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

Answer 5

Ecco una soluzione più semplice. Per me ha funzionato

<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; 
    } 
}); 

il blocco JS impedirà il "" (punto) così uno non posso entrare galleggiante. Stiamo mantenendo il tipo di input come numero, quindi sarà solo il numero come input. Se la lunghezza del valore è 3, restituirà false, quindi la lunghezza dell'input sarà limitata.

Answer 6

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, ''); 
    }); 
} 

Answer 7

Utilizzando onKeyDown lunghezza può essere limitato

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

Felice codifica :)