Campo de fecha HTML5 y texto de marcador de posición en Safari

Question

Tengo un problema, pero no estoy seguro de si es algo que estoy haciendo mal, o si esta característica simplemente aún no es compatible.

Tengo básicamente las siguientes líneas de código:

<input type="text" name="lastname" id="lastname" value="" placeholder="Last name" /> 

<input type="date" name="dob" id="dob" value="" placeholder="Date of birth" /> 

He probado esto en la versión de escritorio de Safari y todo bien, pero cuando lo pruebo en el IPAD, la segunda entrada no lo hace mostrar el texto del marcador de posición. ¿Alguien sabe si el texto del marcador de posición es compatible con type = "date" en el iPad?

Saludos Nick

Answer 1

El iPad está haciendo lo correcto. El atributo placeholderisn't supported on input elements on type date. Probablemente esté funcionando en Safari de escritorio porque no es compatible con el tipo date, por lo que ese atributo se ignora y te queda un campo de texto sin formato. Podrías verificar en el inspector DOM.

Answer 2

poco truco Leve aquí va ...

tienen Inicialmente el campo como un campo de texto. Cuando el usuario se enfoca en el campo, cambie los campos a la fecha y vuelva a enfocar.

ensayaron en iOS6

HTML

<input type="text" placeholder="DOB" id="dob" /> 

JS

<script> 

    var textbox = document.getElementById('dob') 
     textbox.onfocus = function (event) { 
      this.type = 'date'; 
      this.focus(); 
    } 

</script> 

Answer 3

Utilizando la solución de sidarcy:

<input type="date" name="dob" id="dob" value="" 
    placeholder="Date of birth" 
    onfocus="this.type='date';this.focus();" 
    onblur="if(this.value == '') this.type='text';"/> 

Answer 4

CSS para iOS Safari:

input[type='date']:after { 
    color: #aaa; 
    content: attr(placeholder); 
} 

A continuación, utilice el marcador de posición de entrada de fecha:

<input name="mydate" type="date" value="" placeholder="Select a date" />