当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 输入日期之改进模式

Javascript
XmlUtils JS操作XML工具类
jQuery animate效果演示
Jquery 设置标题的自动翻转
JQuery与Ajax常用代码实现对比
学习JS面向对象成果 借国庆发布个最新作品与大家交流
CSS 布局一个漂亮的滑块
兼容多浏览器的JS 浮动广告[推荐]
学习ExtJS(一) 之基础前提
学习ExtJS Column布局
jquery 最简单的属性菜单
有效的捕获JavaScript焦点的方法小结
js css样式操作代码(批量操作)
JS模拟的QQ面板上的多级可展开的菜单
jquery 框架使用教程 AJAX篇
css 有弹动效果的网页导航
jQuery语法总结和注意事项
用AJAX技术做Google Suggest效果
Javascript文档对象模型(DOM)实例分析
Javascript制作拖动网页布局的方法
Javascript解决IE6和FF的PNG图片兼容性问题

Javascript 中的 输入日期之改进模式


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-10   浏览: 188 ::
收藏到网摘: n/a

输入日期之改进模式

    当表单中含有日期输入时,以前的做法通常是由用户输入年月日,然后再对用户输入的数据进行校验。现在我要介绍的一种方法就是,让用户只能输入有效日期,从而无需再在客户端对日期的有效性进行检查。
function foption(N){
var i,N,str,M;
str="";
for(i=1;i<=N;i++)
  {if(i<10) str="<option value='0"+i+"'>"+"0"+i+"</option>";
   else str="<option value='"+i+"'>"+i+"</option>";  
      document.write(str);
  } 
}

function changeri(){
var nian,yue,ri;
ri=31;
yue=form1.selmonth .value ;
if(yue=="04" || yue=="06" || yue=="09" || yue=="11")
  ri=30;
if(yue=="02")
  {nian=form1.selyear.value;
  if((nian%4==0 && nian%100!=0) || nian%400==0)
     ri=29;
   else ri=28;  
  }
 flen=form1.selday .length ;
 form1.selday.length =ri;
 i=flen+1;
 for(i;i<=ri;i++)
   {
    form1.selday .options(i-1).text=i;
    form1.selday .options(i-1).value=i;
   }
}

    以上两个函数是用来初始化表单和改变表单中日期的可选值的。如果你看懂了上面的程序,您稍作改动即可实现更大范围的年份的输入。下面是表单部分代码:
<form name="form1" acrion="" method="post">
 <select name="selyear" onchange="javascript:changeri();">
         <script language="javascript">foption(12);</script>
        </select>年<select name="selmonth" onchange="javascript:changeri();">
         <script language="javascript">foption(12);</script>
        </select>月<select name=selday>
         <div id=selday><script language="javascript">foption(31);</script></div>
        </select>日
</form>
    如果你还有不明白的地方可以email给我:[email protected]。类似的,还有城市的输入,如果您有兴趣,欢迎和我一起探讨!