使用JQuery实现一个当天日期和当前时间
要求:
1、要求年、月、日三个选择框中的数字使用jQuery代码添加,年份是今年开始向前60年,每月的天数要求与月份对应,页面打开时显示当天日期。
2、文本框以秒表的形式显示24小时制时间,要求时、分、秒始终使用二位数字显示,比如05:09:06,点击“开”时,开始显示当前的时间,点击“关”时钟停止计时。
3、点击“确定”按钮使用jQuery代码完成操作:在本部分内容的下方插入一个DIV,其中显示当前所选的年、月、日和时间,设置此DIV宽400PX,高300PX,背景为淡蓝色,字体为楷体,字号为18PX。
目的效果:
实验准备:
编辑平台:Dreamweaver2019
编辑语言:JavaScript、Jquery、html、css
实验代码:
基础框架:
<select id="year"></select>年
<select id="month"></select>月
<select id="day"></select>日
<br />
<br />
<input type="text" id="time" />
<br />
<br />
<input type="radio" name="n" id="start"/>开始
<input type="radio" name="n" id="stop"/>停止
<input type="button" id="btn" value="确定"/>
效果控制:
<script type="text/javascript">
function getTime(year,month,day){
y=year;
m=month;
d=day;
var myDate=new Date(year,month-1,day);
return myDate;
}
function days(year,month){
y=year;
m=month;
return 32-new Date(y,m-1,32).getDate();
}
$(document).ready(function() {
var year=new Date().getFullYear();
var month=new Date().getMonth()+1;
var date=new Date().getDate();
var newyaer=$("#year").append("<option value='"+year+"'>"+year+"</option>")
var newmonth=$("#month").append("<option value='"+month+"'>"+month+"</option>")
for(var year=2019;year>1958;year--){
$("#year").append("<option value='"+year+"'>"+year+"</option>")
}
for(var month=12;month>0;month--){
$("#month").append("<option value='"+month+"'>"+month+"</option>")
};
showDate(year,month);
var w=getTime(year,month,1).getDate()-1;
var num=day+w-1;
$("#year").change(function(){
year=$("#year option:selected").text();
month=$("#month option:selected").text();
showDate(year,month);
});
$("#month").change(function(){
year=$("#year option:selected").text();
month=$("#m