如何使用下拉菜单修复jquery日期选择器日期计算功能

Question

我正在尝试创建一个脚本，根据下拉框的值，它会自动在文本框中填充距离给定日期一个季度、两个季度或两个季度的内容。因此，对于价值季度1，方框1将为"1-1-2011"，方框2将填写"1-4-2011"。目前，我认为在更改日期方面没有发生任何变化。我是一个初学者，几天来一直在努力做到这一点。很抱歉我忽略了一个明显的问题。

元素如下：

<div>
<label>Periode</label>
<select name="pchoice" id="pchoice"  onChange="calcdates()">
<option value="moddate">Zelf invoeren</option>
<option value="quarter1">1e Kwartaal</option>
<option value="quarter2">2e Kwartaal</option>
<option value="quarter3">3e Kwartaal</option>
</select>
</div> 
<div> 
    <label>Datum </label> <input id="startDate" name="startDate" maxlength="10" style="width: 6em;"/> t/m <input id="endDate" name="endDate" maxlength="10" style="width: 6em;"/>
</div>

脚本：

<script type="text/javascript" charset="utf-8">
$(document).ready(
function() {
    var datepickerparam = {
    dateFormat : 'dd-mm-yy',
        dayNamesMin : [ 'Zo', 'Ma', 'Di', 'Wo', 'Do', 'Vr', 'Za' ],
    monthNames : [ 'Januari', 'Februari', 'Maart', 'April','Mei', 'Juni','Juli', 'Augustus', 'September','Oktober', 'November', 'December' ]
    };
    $("#startDate").datepicker(datepickerparam);
    $("#endDate").datepicker(datepickerparam);
});
function calcdates(){
var w = document.pchoice.selectedIndex;
var selected_text = document.pchoice.options[w].value;
var commencedate =  new Date("01-01-2011"); 
var end = new Date();
//make dynamic with some variable
    switch(selected_text){
        case "quarter1":
            $("#startDate").val(commencedate);
            $("#endDate").val(commencedate+90);
        break;
        case "quarter2":
            $("#startDate").value='12-03-2011';
            $("#endDate").value='12-06-2011';
        break;
        case "quarter3":
            $("#startDate").value='13-06-2011';
            $("#endDate").value='13-09-2011';
        break;
        case "moddate":
            $("#startDate").value = '';
            $("#endDate").value ='';              
        break;  
    }
}

Answer 1

添加日期：

var d=new Date();//as today or any other you wish
var e=new Date(d.getFullYear()+"-"+(d.getMonth()+5)+"-"+d.getDate());// end Date

我们增加了五个，因为一月是0，我们必须提供正确的月份

或者如果是，则增加4*30天

new Date(d.valueOf()+1000*60*60*24*4*30)

Answer 2

我解决了它。完整的解决方案是：

<div>
    <label>Period</label>
    <select name="pchoice" id="pchoice" >
    <option value="moddate" selected="selected">Pick date</option>
    <option value="quarter1">1st quarter</option>
    <option value="quarter2">2nd quarter</option>
    <option value="quarter3">3rd quarter</option>
    </select>

<% Date startdate = user.getContact().getOrganisation().getCommencingDate();//Customize this if you copy it!
SimpleDateFormat formatter = new SimpleDateFormat("dd-MM-yyyy");
Calendar cal = Calendar.getInstance();
cal.setTime(startdate);
HashMap <Integer,String> datemap = new HashMap<Integer,String>();
datemap.put(1, formatter.format(startdate));
for (int i=2; i<=6; i++ ){
    if (i%2 == 0){
        cal.add(Calendar.MONTH,3);
    }
    else {
        cal.add(Calendar.DATE,1);
    }    
    String formattedDate = formatter.format(cal.getTime());
    datemap.put(i, formattedDate);
}
%>
$("select").change(function () {
    var selected_text = $(this).val();
   switch(selected_text){
    case "quarter1":
    $("#startDate").val("<%=datemap.get(1)%>");            
    $("#endDate").val("<%=datemap.get(2)%>");
    break;
    case "quarter2":
     $("#startDate").val("<%=datemap.get(3)%>");
     $("#endDate").val("<%=datemap.get(4)%>");
    break;
    case "quarter3":
     $("#startDate").val("<%=datemap.get(5)%>");
     $("#endDate").val("<%=datemap.get(6)%>");
    break;
    case "moddate":
        $("#startDate").val('');
        $("#endDate").val('');
    break;    
}
 });