下拉菜单三级互联小例

      不能不说这Web时代一切都风云变幻。富客户端再一次奇袭人们的眼球,看到很多网站使用了Flex技术,更多的WebGUI和Web前端交互的人性化,智能化带给我们的网上冲浪另一番滋味,哦,冲浪这个词都可以进互联网词汇的祠堂了,太久了。

      翻箱倒柜突然发现磁盘的某个磁道和盘面的夹缝中有一个曾曾经经写的下拉菜单三级互联的小例子,好像有回到了从前。在网上看到新奇的功能有不知道怎么实现的,就只能臆断和DIY,最后能够成个像模像样能开心半天。

    贴出来尿布娱乐下。

  
  
  
  
  1. <html> 
  2.     <head> 
  3.         <title>三级互联,javaScripty实现</title> 
  4.     </head> 
  5.     <script language="javaScript"> 
  6.               
  7.         var year;  
  8.         var month;  
  9.         var day;  
  10.       
  11.     //初始化显示信息  
  12.         function intial(){  
  13.             year=document.getElementById("year");  
  14.             month=document.getElementById("month");  
  15.             day=document.getElementById("day");  
  16.             intitalField(year, 2000, 2015);  
  17.             intitalField(month, 1,  12);  
  18.             intitalField(day, 1, 31);  
  19.         }  
  20.     //下拉菜单信息添加  
  21.         function intitalField(object, startNum, endNum){  
  22.             for(var i=startNum; i<=endNum; i++){  
  23.                 object.options.add(new Option(i, i));  
  24.             }  
  25.         }  
  26.     //闰年判断  
  27.         function isLeap(){  
  28.             year=document.getElementById("year");  
  29.             var yearyearValue=year.options(year.selectedIndex).value;  
  30.             return (yearValue%4==0&&yearValue%100!=0)||yearValue%400==0;  
  31.         }  
  32.     //下拉菜单显示处理  
  33.         function jugeDays(totalDays,len, day){  
  34.             var i;  
  35.             var j;  
  36.             if(len<totalDays){  
  37.                 for(i=len+1; i<=totalDays; i++){  
  38.                     day.add(new Option(i, i));  
  39.                 }  
  40.             }else if(len>totalDays){  
  41.                 for(j=len; j>totalDays; j--){  
  42.                     day.remove(j-1);  
  43.                 }  
  44.             }  
  45.         }  
  46.     //通过月份来获取该月的天数  
  47.         function days(){  
  48.             month=document.getElementById("month");  
  49.             day=document.getElementById("day");  
  50.             var monthmonthValue=month.options(month.selectedIndex).value;  
  51.             var len=day.length;  
  52.             var tag=isLeap();  
  53.             if(monthValue==4||monthValue==6||monthValue==9||monthValue==11){  
  54.                 jugeDays(30, len, day);  
  55.             }else if(monthValue==2){  
  56.                 if(tag){  
  57.                     jugeDays(29, len, day);   
  58.                       
  59.                 }else{  
  60.                     jugeDays(28, len, day);  
  61.                       
  62.                 }  
  63.             }else{  
  64.                 jugeDays(31, len, day);  
  65.             }  
  66.         }  
  67.  
  68.     </script> 
  69.       
  70.     <body onload="intial()" /> 
  71.         <select name="year" id="year" > 
  72.         </select> 
  73.         <select name="month" id="month" onchange="days()"> 
  74.         </select> 
  75.         <select name="day" id="day" > 
  76.         </select> 
  77.     </body> 
  78. </html> 

       现在看到都于心不忍啊。看到这些那才叫时光荏苒啊,天天学习,好好向上,不然对不起那些年的憨厚十足的劲。。

      存在了,拿来主义的用;不存在的,想想如何个弄出来;不造重复的轮子,当然学习的时候还是试试造几个山寨版轮在,要不然都没有上面这些代码了。

      像度假一样工作和生活,哦。

本文出自 “野马红尘” 博客,谢绝转载!

你可能感兴趣的:(三级联动,憨劲十足)