html - ejemplos - La entrada de fecha no funciona en Firefox

title html attribute

Question

Tengo la siguiente entrada de fecha:

<div class="form-group">
    <label for="start_date">Start Date</label>
    <input type="date" class="form-control" name="start_date" id="start_date" placeholder="mm/dd/yyyy">
</div>

Si hago clic en Chrome, aparece un selector de fecha:

Sin embargo, si hago clic en Firefox, el marcador de fecha no aparece arriba:

¿Alguien sabe por qué está pasando esto y / o cómo puedo solucionarlo en Firefox para que sea consistente?

Nota: estoy usando bootstrap 3

¡¡Gracias por adelantado!!

Answer 1

El soporte del navegador para funciones como esta varía mucho. Actualmente, Firefox y muchos otros navegadores no admiten el uso de los elementos <input type=''date'' /> como se menciona aquí y se ven en el cuadro siguiente:

Considere una alternativa basada en Javascript

Lo que podría considerar hacer es usar un complemento basado en Javascript como el DatePicker de jQueryUI para apuntar a cualquier elemento de ese tipo y dejar que se haga cargo de una manera más amigable entre varios navegadores:

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
    $(function(){
         // Find any date inputs and override their functionality
         $(''input[type="date"]'').datepicker();
    });
</script>

Además, también puede considerar buscar en un complemento específico de Bootstrap como bootstrap-datepicker , que podría darle una apariencia más consistente.

Answer 2

Lamentablemente, <input type="date"/> no es compatible con Firefox. Para poder usar el tipo de fecha en todos los navegadores, puede verificar usando modernizador y si no es compatible, puede recurrir a javascript para mostrar el selector de fecha.

<script>
    $(function(){           
        if (!Modernizr.inputtypes.date) {
            $(''input[type=date]'').datepicker({
                  dateFormat : ''yy-mm-dd''
                }
             );
        }
    });
</script>

Answer 3

Pruebe este enlace. Esto está funcionando en firefox http://www.javascriptkit.com/javatutors/createelementcheck2.shtml

Answer 4

Simplemente actualice FireFox a la última versión (v57) este doloroso problema se ha ido para siempre :-)

Ver puedo usar

Documentos : https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date

Prueba :

Answer 5

Ahora se admite la fecha de entrada de Firefox