php+js+mysql设计的仿webQQ-<3>月份天数随月份改

php+js+mysql设计的仿webQQ-<3>月份天数随月份改变

注册时,在填写生日的时候,月份的天数会随着月份的改变而改变,这个小功能在很多的地方都用得到哦!

<5>月份天数随月份改变

PHP代码

[php]
<select name="month" id="month" onchange="monthDays(this.value);">    //onchange事件  
<?php 
for($i=1;$i<=12;$i++) 
    { 
        echo "<option value=".$i.">"; 
        echo $i; 
        echo "</option>"; 
    } 
?> 
</select>月 
<select name="day" id="day"> 
<?php 
for($i=1;$i<=31;$i++) 
    { 
        echo "<option value=".$i.">"; 
        echo $i; 
        echo "</option>"; 
    } 
?> 
</select>日 
<select name="month" id="month" onchange="monthDays(this.value);">    //onchange事件
<?php
for($i=1;$i<=12;$i++)
    {
  echo "<option value=".$i.">";
  echo $i;
  echo "</option>";
 }
?>
</select>月
<select name="day" id="day">
<?php
for($i=1;$i<=31;$i++)
    {
  echo "<option value=".$i.">";
  echo $i;
  echo "</option>";
 }
?>
</select>日

Js代码

[javascript]
function monthDays(month) 
{    
var xmlhttp; 
if (window.XMLHttpRequest) 
  {// code for IE7+, Firefox, Chrome, Opera, Safari  
    xmlhttp=new XMLHttpRequest(); 
  } 
else 
  {// code for IE6, IE5  
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
  } 
xmlhttp.onreadystatechange=function() 
  { 
  if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    {  
    if(month==2) 
          { 
             document.getElementById("day").length=0;     //先把月份天数的select的option清空  
             for(i=1;i<=29;i++) 
                { 
                   document.getElementById("day").options.add(new Option(i,i)); 
                } 
      } 
        else if(month==4||month==6||month==9||month==11) 
               { 
                  document.getElementById("day").length=0; 
                  for(i=1;i<=30;i++) 
                     { 
                        document.getElementById("day").options.add(new Option(i,i)); 
                     } 
               } 
        else 
          { 
              document.getElementById("day").length=0; 
                  for(i=1;i<=31;i++) 
                     { 
                        document.getElementById("day").options.add(new Option(i,i)); 
                     } 
          }      
          
    } 
  }  
xmlhttp.open("GET","index.php",true); 
xmlhttp.send(); 
} 
function monthDays(month)
{ 
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
 if(month==2)
          {
             document.getElementById("day").length=0;     //先把月份天数的select的option清空
             for(i=1;i<=29;i++)
                {
                   document.getElementById("day").options.add(new Option(i,i));
                }
   }
        else if(month==4||month==6||month==9||month==11)
               {
            document.getElementById("day").length=0;
                  for(i=1;i<=30;i++)
                     {
                        document.getElementById("day").options.add(new Option(i,i));
                     }
               }
        else
          {
              document.getElementById("day").length=0;
                  for(i=1;i<=31;i++)
                     {
                        document.getElementById("day").options.add(new Option(i,i));
                     }
          }  
  
    }
  }
xmlhttp.open("GET","index.php",true);
xmlhttp.send();
}
 
这种效果还是用到Ajax的局部刷新技术，欢迎大家交流学习。（未完待续）

 

摘自 wyzhangchengjin123