2012-12-29 26 views
0

我已經做出了三個下降的月份日{1,2,3 ...} 我只希望有效的一天得到顯示在下拉菜單中。 也就是說,如果一月選擇31爲上限,如果二月選擇28或29取決於一年(LEAP與否)選擇標籤事件不超過2次

var monthselected,yearselected,mtype=0,visited=0; 
function reassembleDate(){ 
if(monthselected==4||monthselected==6||monthselected==9||monthselected==11) 
          {mtype=30;} 
         if(monthselected==2&&isleapyear(yearselected)) 
          {mtype=29;} 
         if(monthselected==2&&!isleapyear(yearselected)) 
          {mtype=28;} 

         else if(mtype==0){mtype=31;} 
          removeOptions(); 
          addOptions(mtype);}       
function removeOptions(){ 
var x=document.getElementById('dayselect'); 
while(x.length>29) 
    { x.remove(x.length-1);} 
    } 

function addOptions(mtype) 
{ 
//alert('initialising'); 
var i; 
for(i=29;i<=mtype;i++) 
{ 
var x=document.getElementById("dayselect"); 
    var option=document.createElement("option"); 

option.text=i; 
try 
    {//alert('trying'); 
    // for IE earlier than version 8 
    x.add(option,x.options[null]); 
    } 
catch (e) 
    {//alert('catching'); 
    x.add(option,null); 
    } 
} 
}       
function isleapyear(year){ 
     if((year%4)==0) 
     { 
     if((year%100)!=0) 
     { 
     return true; 
     } 
     else return false; 
     } 
     if((year%400)==0) 
      { 

      return true; 

      } 

else return false; 
}      







<td><select id="month" name="month" class="int" onChange="reassembleDate();" onBlur="monthselected=document.getElementById('month').value; reassembleDate();"  > 
         <option value="">Month</option> 
         <option value="01" >January</option> 
         <option value="02" > February</option> 
         <option value="03" > March</option> 
         <option value="04" > April</option> 
         <option value="05" > May</option> 
         <option value="06" > June</option> 
         <option value="07" > July</option> 
         <option value="08" > August</option> 
         <option value="09" > September</option> 
         <option value="10" > October</option> 
         <option value="11" > November</option> 
         <option value="12" > December</option> 
         </select> 

<label id="year-label" class="year int"> Year</label> 
    <select class="int" id="year" name="year" onChange="reassembleDate();" onBlur="yearselected=document.getElementById('year').value; reassembleDate();"><option value="0" >YYYY</option> 
<?php for($i=2012;$i>1912;$i--){echo "<option value=\"$i\">$i</option>";} ?>   </select> 
<label id="day-label" class="day int">Day</label><select id="dayselect" class="int" name="day" > 
<option value="0" > DD</option> 
<?php for($i=1;$i<29;$i++){echo "<option value=\"$i\">$i</option>";} ?></select> 

代碼工作正常時,有最多兩個變化,但之後的列表日期{1,2,3 ...}不會改變。爲什麼會發生這種情況? 我已經嘗試更改onChange和onBlur等所有事件上的日期,但沒有幫助。

生成的HTML

Birthday</td><td><select id="month" name="month" class="int" onChange="reassembleDate();" onBlur="monthselected=document.getElementById('month').value; reassembleDate();"  > 
         <option value="">Month</option> 
         <option value="01" >January</option> 
         <option value="02" > February</option> 
         <option value="03" > March</option> 
         <option value="04" > April</option> 
         <option value="05" > May</option> 
         <option value="06" > June</option> 
         <option value="07" > July</option> 
         <option value="08" > August</option> 
         <option value="09" > September</option> 
         <option value="10" > October</option> 
         <option value="11" > November</option> 
         <option value="12" > December</option> 
         </select> 

         <label id="year-label" class="year int"> 
    Year</label> 
    <select class="int" id="year" name="year" onChange="reassembleDate();" onBlur="yearselected=document.getElementById('year').value; reassembleDate();"><option value="0" >YYYY</option> 
           <option value="2012">2012</option><option value="2011">2011</option><option value="2010">2010</option><option value="2009">2009</option><option value="2008">2008</option><option value="2007">2007</option><option value="2006">2006</option><option value="2005">2005</option><option value="2004">2004</option><option value="2003">2003</option><option value="2002">2002</option><option value="2001">2001</option><option value="2000">2000</option><option value="1999">1999</option><option value="1998">1998</option><option value="1997">1997</option><option value="1996">1996</option><option value="1995">1995</option><option value="1994">1994</option><option value="1993">1993</option><option value="1992">1992</option><option value="1991">1991</option><option value="1990">1990</option><option value="1989">1989</option><option value="1988">1988</option><option value="1987">1987</option><option value="1986">1986</option><option value="1985">1985</option><option value="1984">1984</option><option value="1983">1983</option><option value="1982">1982</option><option value="1981">1981</option><option value="1980">1980</option><option value="1979">1979</option><option value="1978">1978</option><option value="1977">1977</option><option value="1976">1976</option><option value="1975">1975</option><option value="1974">1974</option><option value="1973">1973</option><option value="1972">1972</option><option value="1971">1971</option><option value="1970">1970</option><option value="1969">1969</option><option value="1968">1968</option><option value="1967">1967</option><option value="1966">1966</option><option value="1965">1965</option><option value="1964">1964</option><option value="1963">1963</option><option value="1962">1962</option><option value="1961">1961</option><option value="1960">1960</option><option value="1959">1959</option><option value="1958">1958</option><option value="1957">1957</option><option value="1956">1956</option><option value="1955">1955</option><option value="1954">1954</option><option value="1953">1953</option><option value="1952">1952</option><option value="1951">1951</option><option value="1950">1950</option><option value="1949">1949</option><option value="1948">1948</option><option value="1947">1947</option><option value="1946">1946</option><option value="1945">1945</option><option value="1944">1944</option><option value="1943">1943</option><option value="1942">1942</option><option value="1941">1941</option><option value="1940">1940</option><option value="1939">1939</option><option value="1938">1938</option><option value="1937">1937</option><option value="1936">1936</option><option value="1935">1935</option><option value="1934">1934</option><option value="1933">1933</option><option value="1932">1932</option><option value="1931">1931</option><option value="1930">1930</option><option value="1929">1929</option><option value="1928">1928</option><option value="1927">1927</option><option value="1926">1926</option><option value="1925">1925</option><option value="1924">1924</option><option value="1923">1923</option><option value="1922">1922</option><option value="1921">1921</option><option value="1920">1920</option><option value="1919">1919</option><option value="1918">1918</option><option value="1917">1917</option><option value="1916">1916</option><option value="1915">1915</option><option value="1914">1914</option><option value="1913">1913</option>                   </select> 

         <label id="day-label" class="day int">Day </label><select id="dayselect" class="int" name="day" > 


           <option value="0" > DD</option> 
           <option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option>           </select> 




<div id="bday-h" class="helptext int" style="display:inline">Select appropriate values</div>                  </td> 
+0

你能複製粘貼生成的html代碼嗎? – ATOzTOA

+0

查看源代碼html thing我在問題 – avck

回答

0

這裏是工作的腳本:

問題:

月份的值/年未平變化時重新計算()。 問題與計算當月天數的檢查。


var monthselected,yearselected,mtype=0,visited=0; 

function reassembleDate(){ 

    monthselected = parseInt(document.getElementById('month').value); 
    yearselected = parseInt(document.getElementById('year').value); 

    if(monthselected == "" || yearselected == "0") { 
     return; 
    } 

    if(monthselected==4||monthselected==6||monthselected==9||monthselected==11) 
     {mtype=30;} 
    else if(monthselected==2&&isleapyear(yearselected)) 
     {mtype=29;} 
    else if(monthselected==2&&!isleapyear(yearselected)) 
     {mtype=28;} 
    else 
     {mtype=31;} 

    removeOptions(); 
    addOptions(mtype); 
} 

function removeOptions(){ 
    var x=document.getElementById('dayselect'); 
    while(x.length>28) 
    { 
     x.remove(x.length-1); 
    } 
} 

function addOptions(mtype) { 
    //alert('initialising'); 
    var i; 
    for(i=29;i<=mtype;i++) 
    { 
     var x=document.getElementById("dayselect"); 
     var option=document.createElement("option"); 

     option.text=i; 
     try 
      {//alert('trying'); 
      // for IE earlier than version 8 
      x.add(option,x.options[null]); 
      } 
     catch (e) 
      {//alert('catching'); 
      x.add(option,null); 
      } 
    } 
}    

function isleapyear(year){ 
    if((year%4)==0) 
    { 
     if((year%100)!=0) 
     { 
      return true; 
     } 
     else return false; 
    } 

    if((year%400)==0) 
    { 
     return true; 
    } 

    else return false; 
} 
+0

中加入了它! 但是如何解析爲int導致事件被觸發兩次 – avck

+0

哪個事件被觸發兩次? – ATOzTOA

+0

請選擇適合您的答案... – ATOzTOA

0

提供的答案是好的,但有一個例外。 2000年的回報不是閏年,因爲它在檢查年份是否可以被400整除之前返回真/假。這是一個固定版本。同樣,我也刪除了所有的數字,因爲它有時會重複29。相反,我已經將所有數字都刪除了,添加一個「 - 」的開始佔位符,然後根據月份完整填充該框。希望這可以幫助。 :-)

<script type="text/javascript"> 
var monthselected,yearselected,mtype=0,visited=0; 

function reassembleDate(){ 

    monthselected = parseInt(document.getElementById('month').value); 
    yearselected = parseInt(document.getElementById('year').value); 

    if(monthselected == "" || yearselected == "0") { 
     return; 
    } 

    if(monthselected==4||monthselected==6||monthselected==9||monthselected==11) 
     {mtype=30;} 
    else if(monthselected==2&&isleapyear(yearselected)) 
     {mtype=29;} 
    else if(monthselected==2&&!isleapyear(yearselected)) 
     {mtype=28;} 
    else 
     {mtype=31;} 

    removeOptions(); 
    addOptions(mtype); 
} 

function removeOptions(){ 
    var x=document.getElementById('dayselect'); 
    while(x.length>0) 
    { 
     x.remove(x.length-1); 
    } 
} 

function addOptions(mtype) { 
    //alert('initialising'); 
    var x=document.getElementById("dayselect"); 
    var option=document.createElement("option"); 
    option.text='--'; 
    try 
     {//alert('trying'); 
     // for IE earlier than version 8 
     x.add(option,x.options[null]); 
     } 
    catch (e) 
     {//alert('catching'); 
     x.add(option,null); 
     } 
    var i; 
    for(i=1;i<=mtype;i++) 
    { 
     var x=document.getElementById("dayselect"); 
     var option=document.createElement("option"); 

     option.text=i; 
     try 
      {//alert('trying'); 
      // for IE earlier than version 8 
      x.add(option,x.options[null]); 
      } 
     catch (e) 
      {//alert('catching'); 
      x.add(option,null); 
      } 
    } 
}    

function isleapyear(year){ 
    if((year%400)==0) 
    { 
     return true; 
    } 

    if((year%4)==0) 
    { 
     if((year%100)!=0) 
     { 
      return true; 
     } 
     else return false; 
    } 

    else return false; 
} 
</script>