输入类型=“日期”在某些浏览器中不起作用答案

【问题标题】：Input type="date" not working in certain browsers输入类型=“日期”在某些浏览器中不起作用
【发布时间】：2017-07-16 01:27:15
【问题描述】：

我有一个 ASP.NET 网页表单页面，在其中我在代码隐藏中设置输入 (type="date") 的值，它在 IE 11 和 Firefox 51 中正确显示，但在 Chrome 56 中和 Opera 43，它只显示 mm/dd/yyyy 占位符。下面是我的代码。

ASPX...

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test Page</title>
    <link rel="stylesheet" type="text/css" href="../Content/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" />
    <link rel="stylesheet" type="text/css" href="../Content/formValidation.min.css" />

    <script type="text/javascript" src="../Scripts/jquery-2.2.3.min.js"></script>
    <script type="text/javascript" src="../Scripts/jquery-ui-1.11.4.min.js"></script>
    <script type="text/javascript" src="../Scripts/bootstrap.min.js"></script>
    <script type="text/javascript" src="//momentjs.com/downloads/moment.min.js"></script>
    <script type="text/javascript" src="../Scripts/formValidation.popular.js"></script>
    <script type="text/javascript" src="../Scripts/framework/bootstrap.js"></script>
    <script type="text/javascript" src="../Scripts/bootbox.min.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <label for="txtChildDOB1" class="control-label col-xs-1">DOB *</label>
        <div class="col-xs-1">
            <input type="date" class="form-control" style="position: absolute; z-index: 999" id="txtChildDOB1" name="txtChildDOB1" value="" runat="server" />
        </div>
    </div>
    </form>
</body>

还有代码隐藏...

        protected void Page_Load(object sender, EventArgs e)
    {
        this.txtChildDOB1.Value = new DateTime(2002, 3, 19).ToShortDateString();
    }

【问题讨论】：

对此您无能为力。较旧的浏览器无法识别这些字段类型，并将其显示为普通的type=text 字段。如果您想确保所有用户看到相同的内容，最好使用 jQuery 插件。
但这些都不是旧浏览器。它们都是最新版本。
也许将文档类型设置为 HTML 5 standard <!DOCTYPE html> 会有所帮助。
已被使用。
见stackoverflow.com/a/57165475/475997

标签： asp.net html webforms browser-support

【解决方案1】：

在回答您的问题之前。 asp.net中有两种输入日期，server side和client side。
在客户端，输入日期如下：

<input type="date" id="datePicker" class="form-control" runat="server" />

在服务器端输入日期是这样的：

<asp:TextBox TextMode="Date" ID="datePicker" class="form-control" runat="server" ></asp:TextBox>

您可以将它们都用于您的目的，但在此之前，您需要准确设置您的时间输入日期。
输入日期只接受yyyy-MM-dd或dd-MM-yyyy这些格式类型。
您必须选择 - 作为日期分隔符，并且肯定选择 4 位年份、2 位月份和 2 位日期。
为了清除我的答案，我在这里写了我的代码：

string makeDate = DateTime.Now.ToString("yyyy") +
            "-" + DateTime.Now.ToString("MM") +
            "-" + DateTime.Now.ToString("dd");

或者在自定义日期，你可以使用这个方法：

public static string makeDate8(DateTime dt)
{
    string date = dt.Year.ToString().PadLeft(4,'0') + "-" + dt.Month.ToString().PadLeft(2, '0') + "-" + dt.Day.ToString().PadLeft(2, '0');
    return date;
}

现在您可以像这样设置输入值：
在客户端：

datePicker.Value = today;

服务器端：
datePicker.Text= today;

【讨论】：