如何在J-Query UI中設置默認日期DatePicker

Question

我想在頁面加載時在我的2文本框控件中設置默認日期。我希望始終將第一個文本框（StartDate）設置爲默認值，以便像01/01/2013那樣是上個月的第一個。另外，我想將第二個文本框（EndDate）設置爲2013年1月31日前的上個月結束。我希望在頁面首次加載時在文本框中加載這些默認值。在此先感謝您的幫助。
這裏是我當前的代碼：

 <link href="Styles/ui-lightness/jquery-ui-1.8.23.custom.css" rel="stylesheet" type="text/css" /> 
     <script src="Scripts/jquery-1.8.1.min.js" type="text/javascript"></script> 
     <script src="Scripts/jquery-1.8.3.js" type="text/javascript"></script> 
     <script src="FusionCharts/jquery.min.js" type="text/javascript"></script> 
     <script src="Scripts/jquery-ui-1.8.23.custom.min.js" type="text/javascript"></script> 

     <script type="text/javascript"> 
      $(document).ready(function() { 
       $('.datepicker').datepicker(); 

      }); 
    </script> 

<div> 
<asp:TextBox ID="StartDate" runat="server" CssClass="datepicker" Width="110px"></asp:TextBox> 
</div> 

<div> 
<asp:TextBox ID="EndDate" runat="server" CssClass="datepicker" Width="110px"></asp:TextBox> 
</div> 

Answer 1

​​

的jQuery：

$(function(){ 
    $("#StartDate").datepicker(); 
    $("#EndDate").datepicker(); 
    var startdate=new Date(); 
    startdate.setMonth(startdate.getMonth() - 1, 1); 
    $("#StartDate").datepicker("setDate",startdate); 
    var endDate=new Date(); // current date 
    endDate.setDate(1); // going to 1st of the month 
    endDate.setHours(-1); 
    $("#EndDate").datepicker("setDate",endDate);  
}); 

jsfiddle

你的代碼（編輯）

<link href="Styles/ui-lightness/jquery-ui-1.8.23.custom.css" rel="stylesheet" type="text/css" /> 
<script src="Scripts/jquery-1.8.1.min.js" type="text/javascript"></script> 
<script src="Scripts/jquery-1.8.3.js" type="text/javascript"></script> 
<script src="FusionCharts/jquery.min.js" type="text/javascript"></script> 
<script src="Scripts/jquery-ui-1.8.23.custom.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#StartDate").datepicker(); 
     $("#EndDate").datepicker(); 
     var startdate=new Date(); 
     startdate.setMonth(startdate.getMonth() - 1, 1); 
     $("#StartDate").datepicker("setDate",startdate); 
     var endDate=new Date(); // current date 
     endDate.setDate(1); // going to 1st of the month 
     endDate.setHours(-1); 
     $("#EndDate").datepicker("setDate",endDate); 
    }); 
</script> 

<div> 
<asp:TextBox ID="StartDate" runat="server" CssClass="datepicker" Width="110px"> </asp:TextBox> 
</div> 

<div> 
<asp:TextBox ID="EndDate" runat="server" CssClass="datepicker" Width="110px"> </asp:TextBox> 
</div> 

注：在鄰刻申對上面的腳本運行，確保ClientIDMode設置爲static

<%@ Page Title="" Language="C#" ClientIDMode="Static" ... 

jsfiddle for jquery 1.8.3 and jquery ui 1.8.23

Answer 2

我能做到這一點是這樣的：

$(".datepicker").datepicker(); 
var firstDay, lastDay; 
firstDay = firstDayNextMonth(new Date(2013, 0, 5)); // january = 0 
lastDay = lastDayNextMonth(firstDay); 
$("#StartDate").datepicker("setDate", firstDay); 
$("#EndDate").datepicker("setDate", lastDay); 

function firstDayNextMonth(date) { 
    var d = date; 
    if(d === undefined) 
     d = new Date(); 

    d.setDate(1); 
    if(d.getMonth() < 11) 
     d.setMonth(d.getMonth() + 1); 
    else 
     d.setMonth(0); 
    return d; 
} 

function lastDayNextMonth(myDate) { 
    var endDate = new Date(myDate.getFullYear(), myDate.getMonth(), 1); 
    if(endDate.getMonth() < 11) 
     endDate.setMonth(endDate.getMonth() + 1); 
    else 
     endDate.setMonth(0); 
    return new Date(endDate.getFullYear(), endDate.getMonth(), 0); 
} 

Link to the code in jsFiddle