En Chrome 15, cuando se utiliza el elemento como campo de texto, los ceros iniciales (por ejemplo, 011) se eliminan incluso si el número introducido no infringe las reglas de validación (por ejemplo, min, max). ¿Hay algún atributo que obligue al cero a permanecer en el campo después de perder el foco? La aplicación para esto es datos numéricos como prefijos de teléfonos internacionales.HTML5 Tipo de entrada = número elimina el cero inicial
<input type="tel"> ha sido introducido para este propósito. Es uno de los nuevos tipos de entrada en HTML5.
¡Agradezco la sugerencia! Sin embargo, también tengo códigos postales y otros campos numéricos informativos donde los ceros a la izquierda son importantes. Me gustaría que mi marcado sea tan semántico como sea posible, y estoy buscando una manera de asegurar que los ceros permanezcan, independientemente del uso específico, y sin recurrir al tipo genérico = input – Evan
'number' obviamente no hace qué necesitas y 'tel' lo hace. Usted preguntó si hay un atributo que no elimine el número inicial. Bueno: 'tel' es la respuesta. Además, el tipo de entrada es menos sobre semántica y más acerca de la interfaz de usuario (qué teclado mostrar en un teléfono inteligente, etc.). –
Usar esto con un patrón de '\ d {5} -? (\ D {4})?' Funciona muy bien para los códigos postales. – Lefka
La respuesta WHATWG me proporciona en IRC fue que para no numérico (por ejemplo, no flota/int) de datos que es numérico en la naturaleza, el texto es generalmente el tipo correcto de entrada de usar. La expectativa es si está utilizando algo donde ya existe un tipo de entrada específico (por ejemplo, números de teléfono, fechas).
tipo de entrada = número solo debe usarse para entradas que son literalmente números (int), y no datos que usan números (como códigos postales).
Su pontificación de la torre de marfil está muy bien, pero en el mundo real, a menudo necesitamos presentar a los usuarios de dispositivos móviles un teclado numérico, incluso para datos no enteros y no flotantes. (Ejemplos: números de tarjetas de crédito, códigos de acceso numéricos). Como todavía ningún navegador ha implementado el atributo 'inputmode' (¡a partir de 2015!), El atributo' type' es nuestra única forma de hacerlo. El posible efecto práctico de seguir la recomendación de WHATWG es romper sin sentido su UI para los usuarios de dispositivos móviles, sin obtener nada más que la satisfacción de haberse conformado a su dogma. –
<input type="text" pattern="[0-9]*" ...
que debe hacerlo por usted. Aparecerá el teclado numérico en el iPhone y los mejores teléfonos con Android que he probado.
Si no desea los extras del teléfono (como '#' y '*') que obtendría en un teclado móvil, esta es la verdadera respuesta. –
Parece, trae el teclado de texto en Android con Chrome. – chhantyal
¿Funciona esto en IE? –
lo necesitaba para navegadores móviles y utiliza una combinación de ambas soluciones de la siguiente manera:
<input type="tel" pattern="[0-9]*">
En iOS, aparece el teclado numérico con sólo números disponibles (sin # o símbolos *), mientras que en los teléfonos Android , el "tel" se interpreta correctamente, pero no el patrón (aún no está en los pocos teléfonos que tengo).
Supongo que cuando los navegadores Android comiencen a implementar el atributo "patrón", esto también debería funcionar bien en Android (como the whatwg spec suggests).
Hasta entonces, deberá verificar los caracteres no numéricos en su entrada y eliminarlos. javascript replace (/ [^ 0-9 *]/g, '') es útil para esto.
Espero que esto ayude
Gracias funciona bien para iOS y Android ... :) – Kailas
¿Cómo está estructurado este formulario? ¿El número se coloca en un campo de texto o en campos de texto separados? – Edwin
El formulario es una forma bastante estándar. Múltiples campos con una variedad de entradas que incluyen texto, radio, cheques, fechas y números. En este caso particular, quiero usar el número para mis campos numéricos, como los códigos postales – Evan