javascript 实现年月日联动
我在用javascript实现年月日联动,没想到给年月日这三个下拉框初始化的时候就出错,自己竟然还找不出错误在哪,麻烦各位帮个忙,给找一下,急!!!!!!!!!!<...
我在用javascript实现年月日联动,没想到给年月日这三个下拉框初始化的时候就出错,自己竟然还找不出错误在哪,麻烦各位帮个忙,给找一下,急!!!!!!!!!!<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=new Option(); for (var i = (y-30); i < (y+30); i++) { yearOption.text=i+" 年"; document.forms[0].selectYear.add(yearOption); } var monthOption=new Option(); for (i=1;i<=12;i++) { monthOption.text=i+" 月"; document.forms[0].selectMonth.add(monthOption); } } </script> </head> <body> <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个回答
展开全部
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(i = intCurrentYear + 30; i >= intCurrentYear - 30; i -- ){
ddlYear.options.add(new Option(i + " 年",i));
}
}
function Month_Bind(){
for(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(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 !!
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(i = intCurrentYear + 30; i >= intCurrentYear - 30; i -- ){
ddlYear.options.add(new Option(i + " 年",i));
}
}
function Month_Bind(){
for(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(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 !!
展开全部
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>年月日</title>
<script type="text/javascript">
function printBirthday() {
var tempDate = new Date();
var y = tempDate.getFullYear();
for (var i = (y - 30); i < (y + 30); i++) {
var yearOption = document.createElement("option");
yearOption.text = i + " 年";
var x = document.forms[0].selectYear;
displayResult(x, yearOption);
}
for (i = 1; i <= 12; i++) {
var monthOption = document.createElement("option");
monthOption.text = i + " 月";
var x = document.forms[0].selectMonth;
displayResult(x, monthOption);
}
}
function displayResult(x, n) {
try {
x.add(n, x.options[null]);
}
catch (e) {
x.add(n, null);
}
}
</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>
测试成功! 请加分 - -
<html>
<head>
<title>年月日</title>
<script type="text/javascript">
function printBirthday() {
var tempDate = new Date();
var y = tempDate.getFullYear();
for (var i = (y - 30); i < (y + 30); i++) {
var yearOption = document.createElement("option");
yearOption.text = i + " 年";
var x = document.forms[0].selectYear;
displayResult(x, yearOption);
}
for (i = 1; i <= 12; i++) {
var monthOption = document.createElement("option");
monthOption.text = i + " 月";
var x = document.forms[0].selectMonth;
displayResult(x, monthOption);
}
}
function displayResult(x, n) {
try {
x.add(n, x.options[null]);
}
catch (e) {
x.add(n, null);
}
}
</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>
测试成功! 请加分 - -
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询