如何设置适用于HTML5浏览器和旧浏览器的type=date输入的默认值

How to set a default value for a type=date input that works with html 5 browsers and with older browsers

本文关键字：浏览器 type 何设置 date 默认值 输入 设置 适用于 HTML5      更新时间：2023-09-26

我想设置日期输入的默认值，例如：25/12/2015（欧洲日期格式）。

如果浏览器与html 5兼容，并且我在输入字段中使用type="date"，我必须添加value="2015-12-15"，但如果浏览器与html 5不兼容，我必须设置value="25/12/2015"。

如何使我的代码（php和js）与这两种浏览器兼容（是否兼容HTML5）？

解决方案#1：我不使用html 5"type=date"。这还不够，因为我想尽可能使用浏览器日期选择器（尤其是智能手机）。

解决方案2：我检查浏览器是否支持HTML5，并相应地设置值，但它有点重。。。

有人有更聪明的解决方案吗？

应该是直接的

var input = document.getElementById('#id_of_your_date_input'); // <input type="date">
if ( input.type === 'date' ) {
    input.value = "2015-12-15";
} else {
    input.value = "25/12/2015";
}

如果支持的话，输入类型将仅为date，在较旧的浏览器中，该类型将回落到text

我试图实现adeneo解决方案，使其"自动"适用于页面的所有type="date"输入。

$date="25/12/2015";
echo "<input name='"date_number_1'" type='"date'" value='"$date'">";
window.onload = manage_date_input();
function manage_date_input(){
   var t_input = document.getElementById('mypage').getElementsByTagName('input');
   for(var i=0; i<t_input.length; i++)
   if(t_input[i].type === 'date'){
      var val=t_input[i].value;
      t_input[i].value=val.substring(6,4)+'-'+val.substring(3,2)+'-'+val.substring(0,2);
}

但它不起作用，因为在onload事件中，由于错误的日期格式，该值似乎已经被输入拒绝了。。。

所以我不得不做"相反的事"：

$date="2015-12-25";
echo "<input name='"date_number_1'" type='"date'" value='"$date'">";
function manage_date_input(){
 var t_input = document.getElementById('mypage').getElementsByTagName('input');
 for(var i=0; i<t_input.length; i++)
 if((t_input[i].name.substring(0,4)=='date')&&(t_input[i].type != 'date')&&t_input[i].value){
   var val=t_input[i].value;
   t_input[i].value=val.substring(8)+'/'+val.substring(5,7)+'/'+val.substring(0,4);
 }
}

它可以与新的html 5浏览器和不处理type=date的旧浏览器无缝配合，但我必须将所有日期输入命名为"date_something"，我相信其中一个可以做得更好；-）

相关文章：