El atributo maxlength HTML no funciona en cromo y safari?

<input type="number" maxlength="5" class="search-form-input" name="techforge_apartmentbundle_searchformtype[radius]" id="techforge_apartmentbundle_searchformtype_radius">

Este es mi HTML, tomado con firebug (en cromo).El atributo maxlength HTML no funciona en cromo y safari?

Se me permite escribir tantos caracteres como desee en el campo de formulario, en Chrome y Safari.

Cuando está en Firefox o IE10, el límite está bien.

No he encontrado este problema en la red.

Nota: type = "number" - not text.

¿Alguien ha visto este problema antes?

Fuente

2012-03-04 Tool

http://stackoverflow.com/questions/18510845/maxlength-ignored-for-input-type-number-in-chrome –

Utilice el atributo max para las entradas de type="number". Se especificará el número más alto posible que usted puede insertar

<input type="number" max="999" />

si se agrega tanto un máximo y un valor mínimo que puede especificar el rango de valores permitidos:

<input type="number" min="1" max="999" />

ver este example

EDITAR

Si, para la experiencia del usuario, prefiere que el usuario no pueda ingresar más de un cierto número, utilice Javascript/jQuery, como se ve en example

Fuente

2012-03-04 13:22:14 jacktheripper

Hablando de HTML 4.01 no existe el tipo de "número". Hablando de HTML 5 FF e IE aún no conocen el tipo de número si http://www.w3schools.com/html5/html5_form_input_types.asp es correcto.

/edit: Así que FF e IE probablemente recurran a texto y esta es la razón por maxlength funcionará.

Fuente

2012-03-04 13:23:43 m02ph3u5

El atributo maxlength no se aplica a una entrada del type = "número"

De especificación W3 HTML 5 en relación con el tipo = "número"

Los siguientes atributos de contenido no deben ser especificadas y no lo hacen aplicar al elemento: accept, alt, checked, dirname, formaction, formenctype, formmethod, formnovalidate, formtarget, height, maxlength, multiple, pattern, size, src, and width.

Fuente: http://dev.w3.org/html5/spec/Overview.html#number-state-type-number (menores de Contabilidad detalles)

En FF y el IE, la entrada está cayendo de nuevo a ser una entrada de texto y, por lo tanto, maxlength se aplica a la entrada. Una vez que FF e IE implementan type = "number", también deberían implementarlo de una manera donde no se aplique maxlength.

Fuente

2012-03-04 15:27:16 keithwyland

no se supone a min = "10000000000" max = "99999999999" trabajo para 11 personajes? No funciona en la mía, ni en Chrome ni en Safari (móvil) – siniradam

Para aquellos que todavía no pueden hacer que funcione ...Prueba esto para encender las teclas numéricas más gordos:

<input type="number" name="no1" maxlength="1" size="1" max="9" pattern="[0-9]*" />

Y el js:

$('input[name="no1"]').keypress(function() { 
    if (this.value.length >= 1) { 
     return false; 
    } 
});

Fuente

2013-03-07 09:16:44

Aquí hay un ejemplo usando type="number" y maxlength, que funciona con Chrome, IE y otros. ¡Espero eso ayude!

<!DOCTYPE html> 
<html> 

    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"> 

     </script> 
     <script> 
      function test(id, event) { 
       var element = $("#" + id); 
       var len = element.val().length + 1; 
       var max = element.attr("maxlength"); 

       var cond = (46 < event.which && event.which < 58) || (46 < event.keyCode && event.keyCode < 58); 

       if (!(cond && len <= max)) { 
        event.preventDefault(); 
        return false; 
       } 
      } 
     </script> 
    </head> 

    <body> 
     <input id="test" size="3" type="number" maxlength="3" onkeypress="test(this.id, event)"> 
    </body> 

</html>

Fuente

2014-04-11 03:45:03 user3325657

Este código funciona tan perfecto incluso en Chrome y Safari como entrada con número de tipo. ¡¡Gracias!! ¡Esto me salvó el día! –

longitud máxima no funcionará con <input type="number" la mejor manera que conozco es utilizar oninput evento para limitar la maxlength. Por favor mira el código a continuación.

<input name="somename" 
    oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);" 
    type = "number" 
    maxlength = "6" 
/>

Fuente

2016-06-15 16:57:58

imho, la mejor solución – Boris

El atributo maxlength HTML no funciona en cromo y safari?

Respuesta

Cuestiones relacionadas