javascript年月日联动的简单介绍

发布时间：2022-11-08

本文目录一览：

  1. javascript 实现年月日联动
  2. 一段javascript写年月日联动的代码
  3. JavaScript怎样生成选择可以年月日的联动下拉列表
  4. JSP使用js实现年月日三级联动，怎么把时间存到SQL 中

javascript 实现年月日联动

  1. 你的代码: 1.1 首先要保证画面一加载，就要执行下拉的初始化方法，所以先要在body标签里添加onload事件，指定好你的初始化方法; 1.2 因为是循环添加下拉的Option，所以Option对象不能在循环外面只new一次，那样会造成同一个对象在下拉中添加多次，从而出错。你代码的年、月下拉都是因为这样出错的。只要修改成每循环一次就new一个新的Option对象就可以了; 你的代码修改如下： 
    <html>
<head>
<title>年月日</title>
<script type="text/javascript">
function printBirthday(){
    document.forms[0].selectDay.length=0;
    var tempDate = new Date();
    var y = tempDate.getFullYear();
    var yearOption;
    for (var i = (y-30); i < (y+30); i++) {
        yearOption = new Option(); //每次循环都重新new 一个Option对象
        yearOption.text = i + " 年";
        document.forms[0].selectYear.add(yearOption);
    }
    var monthOption;
    for (i=1; i <= 12; i++) {
        monthOption = new Option(); //每次循环都重新new 一个Option对象
        monthOption.text = i + " 月";
        document.forms[0].selectMonth.add(monthOption);
    }
}
</script>
</head>
<body onload="printBirthday();">
<form name="formBirthday" action="" method="post">
    <select name="selectYear" size="" onchange="printBirthday()"></select>
    <select name="selectMonth" size="" onchange="printBirthday()"></select>
    <select name="selectDay" size=""></select>
</form>
</body>
</html>
  2. 你代码里的日期也没添加，这个好像要涉及到什么闰年、闰月之类的，我按照自己的思路写了一下代码，你参考着玩吧！ 
    <html>
<head>
<script language="javascript">
var ddlYear = null;
var ddlMonth = null;
var ddlDay = null;
var AOBJ_CurrentDate = null;
function Window_Load(){
    ddlYear = document.getElementById("ddlYear");
    ddlMonth = document.getElementById("ddlMonth");
    ddlDay = document.getElementById("ddlDay");
    AOBJ_CurrentDate = new Date();
    //绑定数据
    Year_Bind();
    Month_Bind();
    Day_Bind();
    //设置Change事件
    ddlYear.onchange = Day_Bind;
    ddlMonth.onchange = Day_Bind;
    //设置默认值(当前日期的年、月、日作为下拉的默认值)
    ddlYear.value = AOBJ_CurrentDate.getYear();
    ddlMonth.value = AOBJ_CurrentDate.getMonth() + 1;
    ddlDay.value = AOBJ_CurrentDate.getDate();
}
function Year_Bind(){
    var intCurrentYear = AOBJ_CurrentDate.getFullYear();
    for(var i = intCurrentYear + 30; i >= intCurrentYear - 30; i--){
        ddlYear.options.add(new Option(i + " 年", i));
    }
}
function Month_Bind(){
    for(var i = 1; i <= 12; i++){
        ddlMonth.options.add(new Option(i + " 月", i));
    }
}
function Day_Bind(){
    //取得当前月的总天数
    var objDate = new Date(ddlYear.value, ddlMonth.value, "0");
    var totalDaysInMonth = objDate.getDate();
    //绑定下拉
    ddlDay.options.length = 0;
    for(var i = 1; i <= totalDaysInMonth; i++){
        ddlDay.options.add(new Option(i + " 日", i));
    }
}
</script>
</head>
<body onload="Window_Load();">
<select id="ddlYear"></select>
<select id="ddlMonth"></select>
<select id="ddlDay"></select>
</body>
</html>
  3. 实在是忍不住了，严重鄙视 xd89910wz ！！

一段javascript写年月日联动的代码

你输出一下 year 和 month 的值 你就发现问题所在了

year = 1990 + i;
objYear.add(new Option(year, i)); // 这里还应该是i吗？

JavaScript怎样生成选择可以年月日的联动下拉列表

<html>
<head>
<style>
#sYear { width:65px; }
#sMonth { width:50px; }
#sDate { width:50px; }
</style>
<script>
function fillSelect() {
    var ddlYear = document.getElementById("sYear");
    var ddlMonth = document.getElementById("sMonth");
    var ddlDate = document.getElementById("sDate");
    var opt = null;
    var curDay = new Date();
    var year = curDay.getFullYear();
    for (var i = -5; i < 5; i++) {
        opt = document.createElement("OPTION");
        opt.value = year + i;
        opt.innerText = (year + i) + "年";
        ddlYear.appendChild(opt);
    }
    ddlYear.value = curDay.getFullYear();
    for (var i = 1; i <= 12; i++) {
        opt = document.createElement("OPTION");
        opt.value = i;
        opt.innerText = i + "月";
        ddlMonth.appendChild(opt);
    }
    ddlMonth.value = curDay.getMonth() + 1;
    fillDate();
    ddlDate.value = curDay.getDate();
}
function fillDate() {
    var ddlYear = document.getElementById("sYear");
    var ddlMonth = document.getElementById("sMonth");
    var ddlDate = document.getElementById("sDate");
    while (ddlDate.options.length > 0) {
        ddlDate.remove(0);
    }
    var selDay = new Date();
    selDay.setFullYear(ddlYear.value, ddlMonth.value, 1);
    var lastDay = new Date(selDay - (24 * 60 * 60 * 1000));
    var days = lastDay.getDate();
    for (var i = 1; i <= days; i++) {
        var opt = document.createElement("OPTION");
        opt.value = i;
        opt.innerText = i + "日";
        ddlDate.appendChild(opt);
    }
}
</script>
</head>
<body onload="fillSelect()">
<select id="sYear" onchange="fillDate()"></select>
<select id="sMonth" onchange="fillDate()"></select>
<select id="sDate"></select>
</body>
</html>

JSP使用js实现年月日三级联动，怎么把时间存到SQL 中

你隐藏一个输入框，里面的值为你选择的日期。当选择了日期这个下拉框，则触发值改变事件，在这里设置隐藏输入框的值，然后把隐藏输入框的值发到服务器。

推荐文章