JQuery datepicker无法正确显示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的datepicker，如jquery示例所示。 任何想法？ 我在这个问题上看到了许多主题，但与我的不完全相同

提前致谢

Answer 1

在TextBox控件中添加ClientIDMode =“Static”以匹配ID选择器

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

然后只保留此标题，datetimepicker应该可以正常工作

    <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>

Answer 2

你指的是错误的选择器（ ID不匹配 ）

  $(function () {
                 $("#startDate").datepicker();
                 $("#endDate").datepicker();
             });

检查这个http://jsfiddle.net/EZdNe/1/

为什么有2个不同的CSS文件？

 <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />   
 <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css">   

这可能会导致CSS冲突 。