Question

我有3个按钮，即一周，上一周和下一周。点击周按钮，它将显示在文本框中选择的日期，并在其中添加6天（例如，2013年6月26日至2013年7月26日））。点击上一个按钮，它将在2013年6月19日至2013年6月26日在标签中显示。点击下一个按钮，它将在标签中显示2013年7月2日至2013年7月8日。这个过程还在继续。我想在javascript中完成这项工作。

enter code here



  <input type="text" id="txtDateFilter" readonly="readonly"  
   style="height: 25px; width: 150px;
   font-size: medium; font-family: Times New Roman;"   runat="server"    />


    <label  id="txtdatetimeshow" runat="server" />
    <input type="button" id="showweekbtn" runat="server" value="week"/>
    <input type="button" id="sfprevbtn" runat="server" value="prev"/>
    <input type="button" id="sfnextbtn" runat="server" value="next"/>

   Javascript Code        

<script type="text/javascript">
$(document).ready(function()
    {
    var txtDate=$("#txtDateFilter").val();
    var today=new Date();
    var day=today.getDay();
    var date=today.getDate();
    var month=today.getMonth();
    var year= today.getFullYear();
    var month_names = new Array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul",   
"Aug", "Sep", "Oct", "Nov", "Dec");

    var NextDate= new Date(year, month, date);

    var weekdate=new Date(txtDate);
    weekdate.setDate(weekdate.getDate()+6);
    var Ndate=NextDate.getDate()+" "+month_names[month]+"   
"+NextDate.getFullYear()+"-"+""+weekdate.getDate()+"  
"+month_names[weekdate.getMonth()]+" "+weekdate.getFullYear();

    var nextWeekDate=new Date(weekdate);
    nextWeekDate.setDate(weekdate.getDate()+6);
    var NWdate=weekdate.getDate()+" "+month_names[weekdate.getMonth()]+" 
"+weekdate.getFullYear()+"-"+""+nextWeekDate.getDate()+" 
"+month_names[nextWeekDate.getMonth()]+" "+nextWeekDate.getFullYear();

    var prevWeekDate=new Date(NextDate);
    prevWeekDate.setDate(NextDate.getDate()-6);
    var PWdate=prevWeekDate.getDate()+" "+month_names[prevWeekDate.getMonth()]+" 
"+prevWeekDate.getFullYear()+"-"+NextDate.getDate()+" 
"+month_names[NextDate.getMonth()]+" "+NextDate.getFullYear();

    //to show previous date
    $("#sfprevbtn").click(function() 
        {
       var prevDate=new Date(year,month,date-1);
       var pdate=prevDate.getDate()+" "+month_names[month] +" "+prevDate.getFullYear();
       $("#txtDateFilter").val(pdate);


            $("#txtdatetimeshow").text(PWdate);

    });
    //to show next date
    $("#sfnextbtn").click(function()
         {

        var nextDate=new Date(year,month,date+1);
        var Ndate=nextDate.getDate()+" "+month_names[month] +"  
"+nextDate.getFullYear();
        $("#txtDateFilter").val(Ndate);


            $("#txtdatetimeshow").text(NWdate);

    });

        //to show week view
        $("#showweekbtn").click(function() 
        {

            $("#txtdatetimeshow").text(Ndate);

});


</script>

Answer 1

我创建了一个名为“getWeekInterval（）”的函数。它使用选择日期来计算在选择日期中添加6天的日期。并以人类可读的字符串格式显示间隔。

function getWeekInterval(){
    var start = pickedDate.getTime()+1000*3600*24*7*pointer;
    var end = start+1000*3600*24*7;
    $("#date-label").text(new Date(start).toDateString()+"~"+new Date(end).toDateString());
}

然后我注册了一个按钮点击事件监听器。当用户通过单击next或prev按钮更改参考日并更新日期标签时，它负责记录所选日期。

$("button").click(function(e){
  switch(e.target.id)
  {
      case "week-btn":
          pointer=0;
          break;
      case "prev-btn":
          pointer--;
          break;
      case "next-btn":
          pointer++;
          break;
  }
  getWeekInterval();
});

我在jsfiddle测试了它。试试吧，希望这对你有所帮助。

获取标签中的星期日期范围

1 个答案: