Javascript 在jQuery中，您将如何根据从下拉列表中选择的月份来增加年份_Javascript_Jquery_Date_Select

Javascript 在jQuery中，您将如何根据从下拉列表中选择的月份来增加年份

javascript jquery date select

Javascript 在jQuery中，您将如何根据从下拉列表中选择的月份来增加年份,javascript,jquery,date,select,Javascript,Jquery,Date,Select,我需要添加一个标准下拉列表，您可以从中选择日期值（月/年），根据您选择的日期，在接下来3个日历季度的下拉列表下方将显示三个复选框例如，如果要从下拉列表中选择2011年9月，它将显示2011年第四季度、2012年第一季度、2012年第二季度的复选框。因为2011年9月是2011年第三季度有没有一种方法可以在不硬编码年份值的情况下执行此操作？我感谢你的帮助选择标记将是： <select name="selectMonth"> <option value="month1"&g

我需要添加一个标准下拉列表，您可以从中选择日期值（月/年），根据您选择的日期，在接下来3个日历季度的下拉列表下方将显示三个复选框

例如，如果要从下拉列表中选择2011年9月，它将显示2011年第四季度、2012年第一季度、2012年第二季度的复选框。因为2011年9月是2011年第三季度

有没有一种方法可以在不硬编码年份值的情况下执行此操作？我感谢你的帮助

选择标记将是：

<select name="selectMonth">
 <option value="month1">Janurary 2011/option>
 <option value="month2">June 2011</option>
 <option value="month3">December 2011</option>
 <option value="month3">February 2012</option>
</select>


2011年1月/选项>
2011年6月
2011年12月
2012年2月

这是我朋友的JS解释，尽管它使用时间戳：

var Selected = "2012-03-28";

var Date = new Date(Selected);
var After = Date.getMonth()+3;
var Before = Date.getMonth()-3;

function sayQuarter(date) {
 var m = Date.getMonth(date);
 var y = Date.getYear(date);
 var q = floor((m / 3) + 0.9);
 if (q.length == 1) { q = "0"+q; }
  return "Q"+q+" "+y;
 }

 var output = "3mo Before = "+Before+" ... "+sayQuarter.Before+"<br/>"+
        "Selected   = "+Selected+" ... "+sayQuarter.Selected+"<br/>"+
        "3mo After  = "+After+" ... "+sayQuarter.After+"<br/>";

 if (document.getElementById('hello')) {
  document.getElementById('hello').innerHTML = output;
 }

var Selected=“2012-03-28”；
var日期=新日期（选定）；
var After=Date.getMonth（）+3；
var Before=Date.getMonth（）-3；
职能部门季度（日期）{
var m=日期。getMonth（日期）；
变量y=日期。getYear（日期）；
var q=地板（（m/3）+0.9）；
如果（q.length==1）{q=“0”+q；}
返回“Q”+Q+“”+y；
}
var output=“3mo Before=“+Before+”…”+sayQuarter.Before+”
+
“Selected=“+Selected+”…“+sayQuarter.Selected+”
”+
“3mo After=“+After+”..“+sayQuarter.After+”
”；
if（document.getElementById（'hello'））{
document.getElementById（'hello'）.innerHTML=output；
}

我需要用Javascript来完成这项工作，并根据select下拉列表中的值进行检查。想法？

首先，我们必须准备一些元素。由于您不希望每年都保存，因此最好动态创建

select

元素：

var monthSelection = document.createElement('select');
var yearSelection = document.createElement('select');
var quartalWrapper = document.createElement('div');

我们在加载页面时填充它们，并将它们添加到文档中：

window.addEventListener('load',function(){    
    var monthNames = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];    
    var i;
    var option;
    for(i = 0; i < 12; ++i){
        option = document.createElement('option');
        option.value = i;
        option.appendChild(document.createTextNode(monthNames[i]));
        monthSelection.appendChild(option);
    }
    for(i = firstYear; i <= lastYear; ++i){
        option = document.createElement('option');
        option.value = i;
        option.appendChild(document.createTextNode(i));
        yearSelection.appendChild(option);
    }
    // Append elements to the document
    document.getElementById('quartal').appendChild(monthSelection);
    document.getElementById('quartal').appendChild(yearSelection);
    // Add an event listener
    monthSelection.addEventListener('change',updateQuartals);
    yearSelection.addEventListener('change',updateQuartals);
});

    if(!quartalWrapper.parentNode){
        for(i = 0; i < 3; ++i){
            var label = document.createElement('label');
            var input = document.createElement('input');
            input.type = 'checkbox';
            input.name = 'quartal[]';
            label.appendChild(input);
            label.appendChild(document.createTextNode('Please choose a date'));
            quartalWrapper.appendChild(label);
        }
        document.getElementById('quartal').appendChild(quartalWrapper);
    }

如果

quartalWrapper

没有父节点，我们将创建标签和复选框，因为这意味着它尚未附加到文档中：

window.addEventListener('load',function(){    
    var monthNames = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];    
    var i;
    var option;
    for(i = 0; i < 12; ++i){
        option = document.createElement('option');
        option.value = i;
        option.appendChild(document.createTextNode(monthNames[i]));
        monthSelection.appendChild(option);
    }
    for(i = firstYear; i <= lastYear; ++i){
        option = document.createElement('option');
        option.value = i;
        option.appendChild(document.createTextNode(i));
        yearSelection.appendChild(option);
    }
    // Append elements to the document
    document.getElementById('quartal').appendChild(monthSelection);
    document.getElementById('quartal').appendChild(yearSelection);
    // Add an event listener
    monthSelection.addEventListener('change',updateQuartals);
    yearSelection.addEventListener('change',updateQuartals);
});

    if(!quartalWrapper.parentNode){
        for(i = 0; i < 3; ++i){
            var label = document.createElement('label');
            var input = document.createElement('input');
            input.type = 'checkbox';
            input.name = 'quartal[]';
            label.appendChild(input);
            label.appendChild(document.createTextNode('Please choose a date'));
            quartalWrapper.appendChild(label);
        }
        document.getElementById('quartal').appendChild(quartalWrapper);
    }

由于以下四分位数始终是为给定月份定义的，因此我们可以将它们硬编码到函数

getQuartals

：

window.getQuartals = function(month){
    var quartArray = [];    
    if (month < 3)
        return [[2,0],[3,0],[4,0]];
    if (month < 6)
        return [[3,0],[4,0],[1,1]];
    if (month < 9)
        return [[4,0],[1,1],[2,1]];
    return [[1,1],[2,1],[3,1]];
}

window.getQuartals=函数（月）{
var-quartArray=[]；
如果（月<3）
返回[[2,0]、[3,0]、[4,0]；
如果（月<6）
返回[3,0]、[4,0]、[1,1]；
如果（月<9）
返回[4,0]、[1,1]、[2,1]；
返回[1,1]、[2,1]、[3,1]；
}

请注意，第一个值是季度，第二个值是年度偏移。您还可以计算以下阵列：

window.getQuartals = function(month){
    var quartArray = [];
    var i;
    month = parseInt(month);
    for(i = 0; i < 3; ++i){
        month+=3;
        quartArray.push([Math.floor(month/3)%4+1,Math.floor(month/12)]);        
    }
    return quartArray;
}

window.getQuartals=函数（月）{
var-quartArray=[]；
var i；
月=parseInt（月）；
对于（i=0；i<3；++i）{
月+=3；
四次推送（[数学楼层（月/3）%4+1，数学楼层（月/12）]；
}
返回四次方阵；
}

JSFIDLE演示：

请注意，此解决方案不使用jQuery。如果您想使用jQuery，请随意更改代码（使用

$（）

或

.on

而不是

addEventListener（）

，…）。