Aspx datepicker浏览器兼容性

时间:2017-10-20 18:18:16

标签: asp.net datepicker

我是使用aspx项目的新手,在FrontEnd我有这样的表:

<table style="width: 450px" id="tabla1">
  <tr>
    <th style="text-align:left">
      <asp:Label runat="server" ClientIDMode="Static" ID="label_fechaini" Text="Fecha de Apertura:" Width="50%"></asp:Label>
      <br />
    </th>
    <th style="text-align:left">
      <asp:Label runat="server" ClientIDMode="Static" ID="label_fechafin" Text="Fecha de Cierre:" Width="50%"></asp:Label>
      <br />
    </th>
  </tr>
  <tr>
    <td>
      <asp:TextBox type="date" ClientIDMode="Static" runat="server" ID="fecha_ini"></asp:TextBox>
    </td>
    <td>
      <asp:TextBox type="date" ClientIDMode="Static" runat="server" ID="fecha_fin"></asp:TextBox>
    </td>
  </tr>
</table>

在Chrome浏览器中,我可以看到日期选择器没有这样的问题:

enter image description here

问题是与其他浏览器的兼容性,例如IE没有显示datepicker.I搜索到CanIuse web。 IE不支持日期。我该怎么做才能解决这个问题?

IE图片:

enter image description here

1 个答案:

答案 0 :(得分:1)

我假设您没有运行IE 7或任何真正的旧版本。 我会调查JQueryUI Datepicker。 它适用于最近的IE和Firefox / Chrome / Mozilla等。

$("#fecha_ini").datepicker();

您可能必须使用此参考输入ID。

$("#<%= fecha_ini.ClientID %>").datepicker();

修改

我的错误。我相信你不能将datepicker应用于asp:TextBox控件,它只适用于html输入。我从答案中删除了那部分。

您需要包含JQUERY和JQUERYUI才能使其正常工作。

<script>
    $(document).ready(function ()
    {
        // Regular way to apply datepicker
        $("#fecha_ini").datepicker();
        $("#fecha_fin").datepicker();

        // If you get error because it cannot find the control use this.
        //$("#<%= fecha_ini.ClientID %>").datepicker();
        //$("#<%= fecha_fin.ClientID %>").datepicker();
    });
</script>
<table style="width: 450px" id="tabla1">
    <tr>
        <th style="text-align:left">
            <asp:Label runat="server" ClientIDMode="Static" ID="label_fechaini" Text="Fecha de Apertura:" Width="50%"></asp:Label>
            <br />
        </th>
        <th style="text-align:left">
            <asp:Label runat="server" ClientIDMode="Static" ID="label_fechafin" Text="Fecha de Cierre:" Width="50%"></asp:Label>
            <br />
        </th>
    </tr>
    <tr>
        <td>
            <asp:TextBox type="date" ClientIDMode="Static" runat="server" ID="fecha_ini"></asp:TextBox>
        </td>
        <td>
            <asp:TextBox type="date" ClientIDMode="Static" runat="server" ID="fecha_fin"></asp:TextBox>
        </td>
    </tr>
</table>