sistemas - ¿Hay alguna forma de localizar el tipo de entrada="fecha" en HTML5?

sistema de recomendacion python

Question

Sé que en el momento de escribir esto, solo Opera admite una interfaz de usuario del navegador para

<input type="date" name="mydate">

y tal vez mis intentos de localizar este campo hayan sido frustrados porque las sutilezas como la localización aún no se han incluido en su implementación, pero ni siquiera lo veo en las especificaciones de HTML5. ¿Hay alguna manera de especificar la localización? ¿Debo hacer lang = "fr" en un elemento padre?

Algunas notas sobre la implementación del sitio en cuestión:

• La localización (lenguaje) es explícitamente seleccionada por el usuario porque está administrando datos en múltiples idiomas y no es razonable esperar que el navegador chrome esté en el idioma que se está viendo o que el navegador proporcione los encabezados de solicitud de idioma deseados.
• Quiero estar seguro de que si la página se representa en francés, el selector de fechas proporcionado por el navegador Chrome muestra las opciones que tienen sentido para el idioma francés.
• El plan es recurrir a jQueryUI para navegadores que no admiten type = "date", usaré el mecanismo de detección provisto en Dive into HTML 5

Answer 1

Estoy de acuerdo con lambacck. Actualmente estoy escribiendo un código Javascript para hacer que las nuevas funciones de formulario estén disponibles en el navegador, usando la interfaz de usuario de jQuery para esto.

Trabajo en Luxemburgo, que es un buen lugar para ilustrar el problema de localización con más detalle.

La mayoría de los sitios web que escribimos son multilingües de | fr | en. Según nuestras estadísticas, podemos decir que las personas usan el interruptor de idioma en el sitio para mostrar su idioma preferido, pero esta opción rara vez coincide con la configuración regional preferida del navegador.

Si el sistema operativo realiza la configuración regional del campo, etc., esto nos lleva de vuelta a la desafortunada situación <input type = file> donde la etiqueta dice Cargar un archivo y el botón dice Parcourir . No puede hacer nada con respecto a esta combinación de idiomas y siempre me pareció una gran molestia.

Conclusión, tengo que sobrescribir el calendario predeterminado con jQuery para estar seguro de que hace lo que quiero.

En mi opinión, una API configurable o al menos una forma de manipular la configuración regional en un nivel de HTML sería genial. Dado que los nuevos tipos de campo aún no han sido ampliamente adoptados por los otros fabricantes de navegadores, imagino que este problema aún podría tenerse en cuenta.

Gracias por leer esto

Answer 2

Para dispositivos móviles, la mejor solución que hemos encontrado es usar una entrada de texto para ingresar la fecha, con un ícono de calendario al lado que tiene una entrada de fecha invisible sobre el ícono.

Ventajas:

• funciona en todos los navegadores y dispositivos
• puede usar el siguiente botón en la fecha en iOS (si hay varios campos)
• el usuario puede escribir la fecha (muy útil)
• evita errores de IU de iOS (1. edición de datos existentes con fecha en blanco, siguiente fecha, valor de fecha establecido hoy - arrrgh, 2. teclado mostrando, siguiente fecha, muestra emergente y el teclado desaparece - ouch)
• utilice una biblioteca de fechas para mostrar la fecha en la entrada como la configuración establecida para la cuenta de usuario (no el navegador), y puede usar una biblioteca de fechas inteligente (escriba "mañana", etc.).
• haga clic en el ícono del calendario para ver la fecha como localización del navegador
• elegante repliegue, incluso si input type=date no es compatible con el dispositivo / navegador (por ejemplo, algunos dispositivos Android no son compatibles con la fecha o tienen errores graves).
• para computadoras de escritorio (detectadas mediante soporte sin contacto) mostramos nuestro propio menú desplegable de fechas personalizadas.

HTML es algo así como:

<input type=text>
<span style=position:relative>
  <input type=date class=date-input tabIndex=-1>
  <div class=date-input-icon>&#x25BC;</div>
</span>

CSS:

.date-input {
  position: relative;
  z-index: 1;
  webkit-appearance: none;
  display: inline-block;
  opacity: 0;
  width: 1em;
}

.date-input-icon {
  position: absolute;
  right: 0;
  width: 1em;
}

Answer 3

Por lo que sé, el pensamiento detrás de lo que hacemos en Opera (divulgación completa: yo trabajo para ellos) es que el selector de fechas es casi una extensión de Chrome, un control nativo del navegador. Como tal, se localizará de acuerdo con el idioma del navegador, en lugar del idioma de la página que se está viendo.