<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
">
<html xmlns="http://www.w3.org/1999/xhtml
">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>月日级联菜单</title>
</head>
<script language="javascript">
function $(id) {return document.getElementById(id);}
function $value(id) {return document.getElementById(id).value;}
function StringToDate(DateStr)
{
var converted = Date.parse(DateStr);
var myDate = new Date(converted);
if (isNaN(myDate))
{
var arys= DateStr.split('-');
myDate = new Date(arys[0],arys[1],arys[2]);
}
return myDate;
}
function ConverDay(year,month,day) // 按月转换日
{
var subitem=$(day);
subitem.innerHTML='';
var year=$value(year);
var date=new Date();
if (year=="") year=""+date.getYear();
var month=$value(month);
var monthday=""+parseInt(month)-1;
var date1=StringToDate(year+"-"+monthday+"-01");
var date2=StringToDate(year+"-"+month+"-01");
var days=((date2-date1)/86400000);
for (i=1;i<=days; i++)
{
var opt=document.createElement("OPTION");
opt.text=i;
opt.value=i;
try{
subitem.add(opt);
} catch(e) {
subitem.add(opt, null);
}
}
}
function monthInit(month,day){//月日初始化
month=$(month)
for (i=1;i<=12; i++)
{
var opt=document.createElement("OPTION");
opt.text=i;
opt.value=i;
try{
month.add(opt);
} catch(e) {
month.add(opt, null);
}
}
day=$(day)
for (i=1;i<=31; i++)
{
var opt=document.createElement("OPTION");
opt.text=i;
opt.value=i;
try{
day.add(opt);
} catch(e) {
day.add(opt, null);
}
}
}
function selectDay(DayItem,Day){//选择中月或日
DayItem=$(DayItem)
for (i=0;i<DayItem.options.length;i++){
if (DayItem.options[i].value==Day){
DayItem.options[i].selected=true;
}
}
}
function bluryear(yy,mm,dd){
var year=$(yy)
if (year.value.length>0){
y=parseInt(year.value);
if(y<=1800||y>=2200){
alert("请正确输入年份！");
year.value="";
year.focus();
return false;
}
}
ConverDay(yy,mm,dd)
}
</script>
<body>
<form id="form1" name="form1" method="post" action="">
<input name="year" type="text" id="year" style="height:14px"
size="4" maxlength="4" onblur="bluryear('year','month','day')"
onKeyPress="return
event.keyCode>=48&&event.keyCode<=57"/>
年
<select name="month" id="month" onchange="ConverDay('year','month','day')">
</select>
月
<select name="day" id="day">
</select>
日
</form>
<script>monthInit("month","day");</script>
</body>
</html>
来自：http://hi.baidu.com/ahwyb/blog/item/2ef50a08d434bf940b7b824d.html
分享到：
相关推荐
通过本文所述的知识点，我们不仅了解了JavaScript日期联动选择器的工作原理和实现细节，还掌握了如何高效操作`<select>`元素以及处理特殊日期逻辑的方法。这些技术在实际开发中极为实用，能够帮助开发者构建更加用户...
在JavaScript编程中，日期联动通常指的是在用户选择一...总之，JavaScript日期联动涉及了DOM操作、事件监听、Date对象的使用，以及可能的AJAX通信。通过这些技术，我们可以创建交互性强、用户体验良好的日期选择功能。
年月日 日期联动 简单容易理解 判断年和月 决定 日 取得的天书
从给定的文件信息中，我们可以了解到的知识点包括JavaScript日期联动选择器的实现方法、兼容性处理、以及一些特定的JavaScript编程技巧。 首先，文档中提到了JavaScript日期联动选择器的实现。这是一个用户界面组件...
综上所述，"js日期三级联动-滑动选择.rar"是一个综合运用JavaScript、jQuery和CSS技术的前端组件，它实现了日期选择的三级联动，配合滑动交互，为用户提供了一种适应多平台的日期选择体验。通过解压并研究其中的...
**JQ 日期联动插件** 在Web开发中，日期选择器是一种常见的用户交互元素，用于方便用户输入或选择日期。而"JQ 日期联动插件"则是基于jQuery库开发的一种增强日期选择功能的工具，它允许开发者创建更加灵活、易用且...
在此示例中，我们通过JavaScript（简称为js）与jQuery库共同协作，实现了一个简单的日期联动效果，使得年份、月份和日期的选择能够根据特定的逻辑进行动态更新。下面将详细解释这一实现过程中的关键知识点。 首先，...
### JS下拉框多级联动实现——出生日期与世界各国选择 #### 一、概述 本文档将详细介绍如何使用JavaScript实现下拉框的多级联动功能，具体应用在两个场景：一是用户选择出生日期（年、月、日）；二是用户选择国籍...
本文实例为大家分享了js实现日期联动选择的相关代码，适用于生日的选择，供大家参考，具体内容如下 实现目标：年月日三个select 输入框，以及一个hidden的input，通过js获取input的值，如果有值切是日期格式，年月日...
本例"ajax实现日期联动"将深入讲解如何利用AJAX来实现两个日期选择器之间的联动效果，即当用户在一个日期选择器中选取日期时，另一个日期选择器会根据预设逻辑自动更新其可选日期范围。 一、AJAX的基本流程 1. **...
### 严格的三级联动日期下拉菜单 在网页开发过程中，日期选择器是非常常见的一个功能模块。特别是对于需要用户输入特定日期的应用场景来说，一个友好且准确的日期选择器能够极大地提升用户体验并减少输入错误的发生...
本文将详细讲解如何使用JavaScript实现年、月、日三级联动的下拉框日期选择器。 首先，我们需要理解“三级联动”这个概念。在年月日的日期选择器中，"三级联动"意味着当用户在一级（年份）下拉框中选择一个年份后，...
在JavaScript和Bootstrap框架中，创建一个生日日期联动选择器是一个常见的需求，特别是在用户注册或个人信息填写的场景下。本文将详细介绍如何使用这两种技术实现这一功能，并确保安全性。 首先，HTML结构是实现...
总结，实现jQuery日期三级联动涉及了HTML、CSS和JavaScript的基本知识，特别是jQuery库的使用，以及对事件处理和DOM操作的理解。通过这样的功能，我们可以提高用户在填写日期信息时的体验，使网页更易用和直观。
在JavaScript（JS）编程中，实现年月日三级联动下拉框日期选择是一种常见的需求，尤其是在网页表单或交互式用户界面中。这种设计允许用户通过三个下拉菜单分别选择年、月和日，形成一个完整的日期。在这个"JS年月日...
在IT领域，尤其是在Web开发中，"jQuery 日期联动"是一种常见的交互功能，它使得用户在选择一个日期后，另一个日期选择器会自动更新或受到限制。这种功能常见于需要设置日期范围，如开始日期和结束日期的场景，如预订...
【原生JS实现日期联动】是一种常见的前端交互功能，它允许用户在选择日期时，不同日期选择器（如年、月、日）之间自动更新，确保所选日期的有效性和关联性。这种功能常见于各种表单和日历应用中，提高了用户体验。 ...