【问题标题】:How to use input type=date in all browsers如何在所有浏览器中使用 input type=date
【发布时间】:2014-05-04 10:04:25
【问题描述】:

日期输入表单是使用

创建的
<form method='post' action='saveform'>
Enter date
<input type='date' value='2014-03-26' name='datefield1'/>
</form>

Chrome 显示本地化日期,允许选择和执行验证。

如果日期初始值为空 Safary Mac OS X 和 IE 显示空字段,不允许选择并且不执行验证。 用户不知道要使用哪种日期格式。

如何解决此问题,以便在 IE 和 Safary 中输入日期。 最关键的是空日期问题。对于空日期,应该向用户指示日期格式 (yyyy-mm-dd),以便用户知道预期的日期格式。 使用本地化日期进行输入、执行验证并允许从日历中进行选择也很不错。

如果可能,在表单发布时发送到服务器的值最好始终采用 yyyy-mm-dd 格式。在最坏的情况下,控制器可以更改为接受不同的格式。

如果浏览器支持,则应使用原生输入 type='date',因为在 chrome 中它看起来比 jquery-ui 日期选择器好得多。

使用jquery、jquery ui、ASP .NET MVC4、Mono。

是否可以在不受支持的浏览器中添加一些模拟 input type='date' 的简单代码或 javascript? 如何判断浏览器是否支持 input type='date'?

【问题讨论】:

  • 我不明白你的问题。你的意思是 Jquery UI 日期选择器不兼容所有浏览器?
  • 没有。我的意思是 Chrome 内置的日期输入支持看起来比 jquery ui datepicker 好得多

标签: jquery asp.net-mvc html jquery-ui datepicker


【解决方案1】:

回答你的第一个问题

是否可以在不受支持的浏览器中添加一些模拟 input type='date' 的简单代码或 javascript?

有很多jquery datepicker库可用,你可以搜索实现

如何判断浏览器是否支持input type='date'?

由于你使用的是 ASP.NET MVC 4,Modernizr.js 是内置的,所以你可以试试这个:

if (Modernizr.inputtypes.date) {
    $('label').text("Support");
} 
else {
    // do your datapicker here
}

【讨论】:

    【解决方案2】:

    在 document.ready 函数上使用它

    $( "#datepicker" ).datepicker({ dateFormat: "yy-mm-dd" });
    

    【讨论】:

    • 模拟输入类型=日期日期输入格式应为 dd.mm.yyyy 但发布到服务器的日期应为 yyyy-mm-dd 格式。如何实现?
    猜你喜欢
    • 2013-08-03
    • 2012-04-28
    • 1970-01-01
    • 2013-11-21
    • 2017-01-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多