тип ввода = заполнитель даты на iOS?

Мне потребовалось некоторое время, чтобы понять это, оставьте его как type="text" и добавьте onfocus="(this.type='date')"

мне даже нравится онблур, о котором я упоминал

<input placeholder="Date" class="textbox-n" type="text" onfocus="(this.type='date')" onblur="(this.type='text')" id="date">

атрибут placeholder, который работает с текстовыми полями, отображается только в настольной версии, а не в iphone. Есть ли способ обойти это?

Попробуйте использовать javascript и css.

<div id="closing_date">
<label for="closing_date_field" class="overlabel">Closing Date</label>
<input id="closing_date_field" type="date" name="closing_date">
</div>

см. код здесь

Я заставил его работать с некоторым псевдоклассом ":before" и небольшим количеством javascript. У вас должен быть класс или идентификатор на вашем входе. Вот пример с идентификатором "myInput"

 #myInput:before{ content:"Date of birth"; width:100%; color:#AAA; } 
 #myInput:focus:before,
 #myInput.not_empty:before{ content:none }

Затем в javascript добавьте класс «not_empty» в зависимости от значения в событиях onChange и onKeyUp.

Вы даже можете добавить все это динамически в каждое поле даты.

Вот примерный код для этого:

$('input[type=date]').each(function(){
    var input=$(this);
    var id=input.attr('id');
    if (!id){
        id='RandomGeneratedId_'+Math.random().toString(36).substring(7);
        input.attr('id',id);
    }
    var placeholder=input.attr('placeholder');
    if (placeholder){
        $('head').append('<style> #'+id+':before{ content:"'+placeholder+'"; width:100%; color:#AAA; } #'+id+':focus:before,#'+id+'.not_empty:before{ content:none }</style>');
    }
    input.on('change keyup',function(){
        if ($(this).val()){
            $(this).addClass('not_empty')
        }else{
            $(this).removeClass('not_empty')
        }
        return false;
    });
});

Это не идеально, но хорошо работает в браузерах Chrome и iOS7.