在選擇下拉菜單中加載javascript

Question

我有3個年份，月份和日期的下拉菜單。當我點擊一年時，下拉菜單正常工作，它會加載一個月，並在選擇一個月後加載日期。我遇到的問題是我選擇年份，月份和日期。 例如我選擇的日期是：

year --> 1990 month-->2日期只有28天。好好工作。

但是當我更改爲新的一年時，月份變爲1，並且日期仍然顯示28天，它應該顯示31天。

我打算在body標籤或select中包含onload，但根本不起作用。 有什麼建議嗎？

  function daysInMonth(m, y){ 
 
       return m===2?y&3||!(y%25)&&y&15?28:29:30+(m+(m>>3)&1); 
 
      } 
 

 
      var monthArray = []; 
 
      var dateArray = []; 
 
      function onYearChange() { 
 
       monthArray =[]; 
 
       var year = document.getElementById("yeardialog").value 
 
        if (document.getElementById("yeardialog").value != "0"){ 
 
         for(var i = 1 ; i<=12; i++){ 
 
         monthArray.push(i + ''); 
 
         dateArray.push(daysInMonth(i, year)); 
 
        } 
 

 
       var select = document.getElementById("monthdialog"); 
 
        select.innerHTML = ""; 
 
         for(var i = 0; i < monthArray.length; i++) { 
 
          var monthOptions = monthArray[i].replace('', ''); 
 
          var el = document.createElement("option"); 
 
           el.textContent = monthOptions + ''; 
 

 
          if(monthOptions<10){ 
 
           monthOptions = '0'+monthOptions 
 
          } 
 
           el.value = monthOptions; 
 
           select.appendChild(el); 
 
         } 
 
      \t \t console.log(monthArray); 
 
    \t \t \t } 
 
    \t \t } 
 

 
      function onMonthChange(){ \t 
 
       if(dateArray.length>12){ 
 
        dateArray.splice(0, 12); 
 
       } 
 
       var dates =[]; 
 
       var month = document.getElementById("monthdialog").value; 
 
       var endDay = dateArray[month.replace('', '')-1]; 
 

 
       for(var date = 1; date<=endDay; date++){ 
 
        dates.push(date + ''); 
 
       } 
 

 
       var select = document.getElementById("datedialog"); 
 
       select.innerHTML = ""; 
 

 
       for(var i = 0; i < dates.length; i++) { 
 
        var dateOptions = dates[i].replace('', ''); 
 
        var el = document.createElement("option"); 
 
         el.textContent = dateOptions + ''; 
 

 
        if(dateOptions<10){ 
 
         dateOptions = '0'+dateOptions 
 
        } 
 
        el.value = dateOptions; 
 
        select.appendChild(el); 
 
       } 
 
      }

<select id="yeardialog" name="yeardialog" onchange="onYearChange()"> 
 
    <option value="">--</option> 
 
    <option value="1990">1990</option> 
 
    <option value="1991">1991</option> 
 
    <option value="1992">1992</option> 
 

 
</select> 
 
<select id="monthdialog" onchange="onMonthChange()"> 
 
    <option></option> 
 
</select> 
 

 
<select id="datedialog"> 
 
    <option></option> 
 
</select>

我今天要解決這個問題。

Answer 1

只需在onYearChange（）年後的onMonthChange（）下拉列表中添加。它會工作。

Answer 2

function daysInMonth(m, y){ 
 
       return m===2?y&3||!(y%25)&&y&15?28:29:30+(m+(m>>3)&1); 
 
      } 
 

 
      var monthArray = []; 
 
      var dateArray = []; 
 
      function onYearChange() { 
 
       monthArray =[]; 
 
       var year = document.getElementById("yeardialog").value 
 
        if (document.getElementById("yeardialog").value != "0"){ 
 
         for(var i = 1 ; i<=12; i++){ 
 
         monthArray.push(i + ''); 
 
         dateArray.push(daysInMonth(i, year)); 
 
        } 
 

 
       var select = document.getElementById("monthdialog"); 
 
        select.innerHTML = ""; 
 
         for(var i = 0; i < monthArray.length; i++) { 
 
          var monthOptions = monthArray[i].replace('', ''); 
 
          var el = document.createElement("option"); 
 
           el.textContent = monthOptions + ''; 
 

 
          if(monthOptions<10){ 
 
           monthOptions = '0'+monthOptions 
 
          } 
 
           el.value = monthOptions; 
 
           select.appendChild(el); 
 
         } 
 
         onMonthChange(); 
 
      \t \t console.log(monthArray); 
 
    \t \t \t } 
 
    \t \t } 
 

 
      function onMonthChange(){ \t 
 
       if(dateArray.length>12){ 
 
        dateArray.splice(0, 12); 
 
       } 
 
       var dates =[]; 
 
       var month = document.getElementById("monthdialog").value; 
 
       var endDay = dateArray[month.replace('', '')-1]; 
 

 
       for(var date = 1; date<=endDay; date++){ 
 
        dates.push(date + ''); 
 
       } 
 

 
       var select = document.getElementById("datedialog"); 
 
       select.innerHTML = ""; 
 

 
       for(var i = 0; i < dates.length; i++) { 
 
        var dateOptions = dates[i].replace('', ''); 
 
        var el = document.createElement("option"); 
 
         el.textContent = dateOptions + ''; 
 

 
        if(dateOptions<10){ 
 
         dateOptions = '0'+dateOptions 
 
        } 
 
        el.value = dateOptions; 
 
        select.appendChild(el); 
 
       } 
 
      }

<select id="yeardialog" name="yeardialog" onchange="onYearChange()"> 
 
    <option value="">--</option> 
 
    <option value="1990">1990</option> 
 
    <option value="1991">1991</option> 
 
    <option value="1992">1992</option> 
 

 
</select> 
 
<select id="monthdialog" onchange="onMonthChange()"> 
 
    <option></option> 
 
</select> 
 

 
<select id="datedialog"> 
 
    <option></option> 
 
</select>

Answer 3

function onYearChange() { 

      monthArray =[]; 
      var year = document.getElementById("yeardialog").value 
      if (document.getElementById("yeardialog").value != "0"){ 
         for(var i = 1 ; i<=12; i++){ 
         monthArray.push(i + ''); 
         dateArray.push(daysInMonth(i, year)); 
        } 

       var select = document.getElementById("monthdialog"); 
        select.innerHTML = ""; 
       for(var i = 0; i < monthArray.length; i++) { 
       var monthOptions =monthArray[i].replace('', ''); 
          var el = document.createElement("option"); 
           el.textContent = monthOptions + ''; 

          if(monthOptions<10){ 
           monthOptions = '0'+monthOptions 
          } 
           el.value = monthOptions; 
           select.appendChild(el); 
         } 
        console.log(monthArray); 
       } 
       onMonthChange(); 
      } 

call `onMonthChange();` function inside `onYearChange();` 

因爲日期將在本月改變加載。因爲年份更改不會觸發月份更改事件，因此日期下拉列表未加載。