javascript 下拉框显示当前日期
2018-10-12 14:06
344 查看
需要增加的地方:
<option value="2010">2010</option>
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
测试代码:
<html>
<head>
<meta name="GENERATOR" content="Microsoft FrontPage 6.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>* 您消费的时间</title>
</head>
<body>
<table width="500" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="22%" height="25" bgcolor="F7F7F7">
<span class="title_red STYLE2">* </span>您消费的时间
</td>
<td width="20%" bgcolor="F7F7F7">
<select id="years">
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
</select> 年
</td>
<td width="15%" bgcolor="F7F7F7">
<select id="months">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select> 月
</td>
<td width="15%" bgcolor="F7F7F7">
<select id="days">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select> 日
</td>
<td width="15%" bgcolor="F7F7F7">
<select id="hours">
<option value="00">00</option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
</select> 点
</td>
<td width="15%" bgcolor="F7F7F7">
<select id="mins">
<option value="00">00</option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
</select> 分
</td>
</tr>
</table>
<script>
var today=new Date()//定义一个时间对象
var yy=today.getYear()
var mm=today.getMonth()+1
var dd=today.getDate()
var h=today.getHours()//定义小时
var m=today.getMinutes()//定义分钟
document.getElementById("years").options(yy-2007).selected=1
document.getElementById("months").options(mm-1).selected=1
document.getElementById("days").options(dd-1).selected=1
document.getElementById("hours").options(h).selected=1
document.getElementById("mins").options(m).selected=1
</script>
</body>
</html>
第二种方法:不需要事先写好年份,可扩展性比较好
第三种方法:不能用,但编程思路还可以,如果正式使用建议用第二种方法
<html>
<head>
<title> New Document </title>
</head>
<body>
<script>
function setDay(obj){
obj = obj.form;
var years=parseInt(obj.years.options[obj.years.selectedIndex].value);
var months=parseInt(obj.months.options[obj.months.selectedIndex].value);
if(obj.years.selectedIndex==0 || obj.months.selectedIndex==0)return;
var lastday = monthday(years,months);
var itemnum = obj.days.length;
if (lastday - 1 < obj.days.selectedIndex)
{
obj.days.selectedIndex = lastday - 1;
}
obj.days.length = lastday;
for(cnt = itemnum + 1;cnt <= lastday;cnt++)
{
obj.days.options[cnt - 1].text = cnt;
}
}
function monthday(years,months)
{
var lastday = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
if (((years % 4 == 0) && (years % 100 != 0)) || (years % 400 == 0))
{
lastday[1] = 29;
}
return lastday[months - 1];
}
function forto(ff,to)
{
document.write('<OPTION value=""></OPTION>');
for(var ii=ff; ii<=to; ii++)
document.write('<OPTION value="'+ii+'">'+ii+'</OPTION>');
}
function a()
{
alert(document.all("years").value+"年"+document.all("months").value+"月"+document.all("days").value+"日") ;
}
</script>
<FORM>
<SELECT name="years" onChange="setDay(this);">
<script>forto(1990,2030)</script>
</SELECT>年
<SELECT name="months" onChange="setDay(this);">
<script>forto(1,12)</script>
</SELECT>月
<SELECT name="days"></SELECT>日
</form>
</body>
</html>
您可能感兴趣的文章:
相关文章推荐
- javascript 下拉框显示当前日期
- JavaScript代码:在网页中动态显示当前日期和时间
- JavaScript基础 下拉列表 点击按钮 显示当前选项的索引值
- 用javascript显示当前日期及星期
- javascript 应用技巧 显示当前日期
- JavaScript基础 下拉列表 点击按钮 显示当前选项的索引值
- 使用JS,JQuery实现下拉框显示当前日期之前的年月
- JavaScript显示当前文档最后修改日期的方法
- JS实现下拉列表显示当前日期到之前半年的所有日期
- JavaScript实现在标题栏上显示当前日期的方法
- javascript显示当前日期(2009年9月18日 星期五 农历七月三十 11:36:28)
- JavaScript 显示当前日期
- select 设置下拉列表的选中项的值 显示当前日期 年份 月份 下拉列表获取当前日期
- javascript显示当前日期时间和当前为本年第几周
- JavaScript在浏览器标题栏上显示当前日期和时间的方法
- Javascript: 在下拉列表中选择年份和月份,然后判断是瑞年还是平年,在日日期得下拉列表中显示瑞年二月对应多少天,平年对应多少天。
- JavaScript显示当前日期源码
- JavaScript 显示当前日期
- 【温故而知新】Javascript时间效果(显示当前时间、显示当前日期、显示页面停留时间、倒计时)
- javascript实现显示系统当前日期