javascript - JQuery 日期选择器无法使用 css 正确显示

Question

我的问题是日历无法正确显示(不使用谷歌CSS) 这是我的代码:

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
     <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>      
     <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css">   
     <script src="http://code.jquery.com/jquery-1.9.1.js"></script>    
     <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
     <script>
         $(function () {
             $("#MainContent_startDate").datepicker();
             $("#MainContent_endDate").datepicker();
         });
     </script>
</asp:Content>


<asp:TextBox ID="startDate" CssClass="InfoData" runat="server" TextMode="Date" Visible="false"></asp:TextBox>

<asp:TextBox ID="endDate" CssClass="InfoData" runat="server" TextMode="Date" Visible="false"></asp:TextBox>

我尝试过使用 IE、FF 和 Chrome。在 IE 中，它在底部显示:“仅显示安全内容”。如果我单击“显示所有内容”，则日期选择器将使用 googles css 正确显示。但在 FF 和 Chrome 中我没有这种可能性。但我认为它根本不应该问这个，它应该只显示具有正确CSS的日期选择器，如jquery示例所示。 任何想法？我看到很多关于这个问题的主题，但与我的不完全相同

提前致谢

Answer 1

在您的 TextBox 控件中添加 ClientIDMode="Static" 以匹配 ID 选择器，例如

    <asp:TextBox ID="endDate" ClientIDMode="Static" runat="server" />

然后仅保留此 header ，日期时间选择器应该可以工作

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <script type="text/javascript">
          $(document).ready(function () {
             $("#startDate").datepicker();
             $("#endDate").datepicker();
         });
    </script>