输入日期占位符不会在Android浏览器

Question

作为我问题中的标题。

我有这个简单的脚本

<input type="date" aria-label="Check Out" class="form-control contact-form hidden-sm hidden-xs" id="b-checkout" placeholder="<?php date('d-m-Y') ?>" /> 

在Dekstop版本中运行良好，而且我在inspect元素中使用移动视图也运行良好。

但是当我用android浏览器测试时，占位符第一次不显示，但是在我选择了日期后，占位符将会出现。

我所做的是添加这个css脚本

input[type="date"]::before { 
     content: attr(placeholder);
     width:100%;
     }

但是我在android浏览器中测试后，占位符将是2个内容，我选择不同的日期后，看到图像。

而且我在输入日期做了一些更改

<input onfocus="this.placeholder = ''" type="date" type="date" aria-label="Check In" class="form-control date-mobile hidden-lg hidden-md" id="b-checkin2" placeholder="<?php date('d-m-Y') ?>" />

在android浏览器中它运行良好，但是在inspect元素的移动视图中，占位符在我选择日期后不显示，请参阅图像

再次进行一些更改

<input onfocus="this.placeholder = ''" onchange="this.placeholder= this.value" type="date" type="date" aria-label="Check In" class="form-control date-mobile hidden-lg hidden-md" id="b-checkin2" placeholder="<?php date('d-m-Y') ?>" />

但是我在android浏览器中测试后出错了，请看图像

Answer 1

我认为这是因为你指定如果屏幕尺寸小或中等，你就不会显示这个元素......

...hidden-lg hidden-md....

如果你删除它，它应该显示良好。