避免用户输入日期时出错，用下拉列表选择日期，尽量减少用户手工输入。这样可以减少对日期的判断.
下面的代码输入的效果就是有三个下拉列表，分别是'year','month'和'day'，单击下拉列表可以对日期进行选择：（自己写的，如果有更简单的，请同志们留言分享一下）
<html><head>
<script language="javascript">
function getobj(id){
return document.getElementById(id);
}
function list(){
var date=new Date();
var le1=date.getFullYear()-1970;
addlist('year',1970,le1);
addlist('month',1,12);
addlist('day',1,31);
}
function febday(){//判断不同的情况下二月的天数，并更改日的列表项中的内容
var year=getobj('year').value;
var month=getobj('month').value;
var bigm=new Array('1','3','5','7','8','10','12');
var bigstr=bigm.join('-');
var smallm=new Array('4','6','9','10');
var smallstr=smallm.join('-');
if(bigstr.indexOf(month)>-1)
addlist('day',1,31);
if(smallstr.indexOf(month)>-1)
day(30);
if(month=='2'){
if(isRui(year)){
day(29);
}else{
day(28);
}
}
}
function day(num){//改变二月的天数
var list=getobj('day');
var listlen=list.options.length;
for(var i=listlen-1;i>=num;i--){
list.options[i]=null;
}
}
function isRui(year){//是否是闰年
if((year%400==0)||(year%4==0 && year/100!=0))
return true;
return false;
}
function addlist(obj,begin,length){//为列表项中批量添加项目
var list=getobj(obj);
for(var i=0;i<length;i++){
var num=i+begin;
list.options[i]=new Option(num,num);
}
}
</script>
</head>
<body onload="list();">
<form name="form" id="form">
<select id="year" name="year" onchange="febday();">
</select>年
<select name="month" id="month" onchange="febday();">
</select>月
<select name="day" id="day">
</select>日
</form>
</body>
</html>
分享到：
相关推荐
《jQuery下拉列表框日期选择代码详解》 在网页开发中，用户界面的交互性和易用性至关重要。jQuery，作为一款强大的JavaScript库，为开发者提供了丰富的功能和便捷的API，使得实现复杂的交互效果变得轻而易举。本篇...
6. 类似地，当月选择变化时，再次发起请求获取对应月份的日期数据，并填充日期下拉列表。 以上就是实现“jsp出生日期三级级联下拉列表”的核心要点。通过这样的设计，用户可以方便地在一个整洁的界面上选择他们的...
接下来，我们需要使用JavaScript来监听下拉列表的`change`事件，当用户选择一个新选项时，触发跳转操作。可以使用以下代码： ```javascript document.getElementById('dropdown').addEventListener('change', ...
在本文中，我们将探讨如何使用JSP（JavaServer Pages）技术实现关联下拉列表的功能，具体来说是如何根据用户选择的年份和月份动态更新显示的日期列表。这是一个实用且常见的功能，在很多需要用户输入日期的应用场景...
本文将详细探讨jQuery树形插件在下拉列表选择框中的应用，以及如何利用它来提升用户的操作体验。 首先，"jQuery树形插件下拉列表选择框"是一种创新的UI设计，它将传统的下拉列表与树形结构相结合，使用户可以在层级...
本文将深入探讨如何使用jQuery UI库来创建功能丰富的下拉列表选择菜单，同时提供一份实际可运行的代码示例，帮助开发者更好地理解和应用这一技术。 jQuery UI 是一个基于jQuery库的扩展，提供了丰富的用户界面组件...
HTML部分主要包含了一个表单(form)，表单内有三个下拉列表(select)分别用于显示年份(YYYY)、月份(MM)和日期(DD)。 ```html <select name="YYYY" onchange="YYYYDD(this.value)"> 请选择 年 </select> <select ...
根据提供的文件信息，本文将详细解析“下拉列表关于年月日的显示”这一主题，主要涉及以下几个方面：实现年份、月份、日期选择器的基本原理；JavaScript代码解读及其功能；以及如何根据不同的年份来动态调整月份和...
一种常见的方式是使用`<option>`标签创建一个包含所有日期的下拉列表。每个`<option>`标签对应一个日期，用户可以通过下拉菜单选择。另一种更先进的方法是利用HTML5的`<input type="date">`，这将提供一个内置的日历...
在ASP中实现日期下拉菜单可以提高用户界面的友好性，让用户更方便地选择日期。以下是一个简单的ASP实现日期下拉菜单的例子： 首先，HTML部分包含三个`<select>`元素，分别用于年、月和日的选择。每个`<select>`都有...
在JavaScript编程中，下拉列表（Select元素）是网页交互中常见的组件，常用于提供用户选择的选项。本文将深入探讨如何使用JavaScript实现一个下拉列表，点击后能以“2011-12-2 星期五”这样的格式显示日期。 首先，...
为了实现更复杂的功能或更好的视觉效果，开发者有时会选择用JavaScript库（如Select2、Chosen等）来模拟下拉列表，这些库提供了搜索、多选等特性。 在提供的TestDemo中，很可能是包含了上述一些概念的简单示例，...
在JavaScript编程中，创建一个动态的起始年份下拉列表功能是一项常见的需求，尤其在构建日期选择器或者填写表单时。这个实例的核心在于利用JavaScript的事件监听、DOM操作和数组方法来实现动态更新结束年份的下拉...
在这个场景中，用户可以通过下拉列表轻松选择一周的时间范围。 EasyUI是一个基于jQuery的UI框架，它提供了丰富的组件来简化前端开发工作，如数据网格、表单、窗口、菜单等，当然也包括我们的主题——“周选择下拉...
综上所述，"单击文本框显示时间下拉列表Data.js"是一个利用优化后的Date.js库实现的交互功能，它提升了用户在网页上选择日期的便捷性。通过研究和使用这个压缩包中的Date.js源码，开发者可以学到关于日期处理、用户...
但是，有时我们也需要实现下拉列表的小三角形样式，例如日期选择器中的下拉列表。今天，我们将讨论如何使用 HTML、CSS 和 JavaScript 实现下拉列表的小三角形样式。 首先，让我们来看一下 HTML 代码： ```html ...
这里我们讨论的“JQuery写的日期级联下拉菜单”是一个利用jQuery库实现的交互式用户界面组件，允许用户通过三个连续的下拉列表分别选择年、月和日。这种设计使得用户能够快速、准确地输入日期，同时保持页面的简洁性...
开发者可能创建了一系列的下拉列表，每个分别对应年、月、日，或者使用弹出的日历视图。这些插件通常提供便利的方法来获取和设置日期，以及自定义格式化日期的显示。 在描述中提到，这个代码实例是“非常实用”的，...
"JS城市配送下拉列表美化表单"就是一个针对这个问题的解决方案，它优化了用户在选择配送地址时的操作流程，使得选择省市地区的体验更加友好。这个压缩包文件包含了一个经过美化和优化的JavaScript代码，用于实现一个...