年月日三级联动(纯JS)
来源:互联网 发布:mysql minpoolsize 编辑:程序博客网 时间:2024/04/26 00:38
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script type="text/javascript">
var currentDate = new Date();
var currentYear;
var currentMonth;
$(function(){
renderYearSelect();
renderMonthSelect();
renderDaySelect(currentMonth);
})
// 生成【年份】下拉框的内容
function renderYearSelect(){
currentYear = currentDate.getFullYear();
for(var i = currentYear - 50; i < currentYear + 10; i++){
$("#yearSelect").append("<option>"+i+"</option>");
}
$("#yearSelect option[value="+currentYear+"]").attr("selected", "selected");
}
function renderMonthSelect(){
currentMonth = currentDate.getMonth() + 1;
for(var i = 1; i <= 12; i++){
$("#monthSelect").append("<option value="+i+">"+i+"</option>");
}
$("#monthSelect option[value="+currentMonth+"]").attr("selected", "selected");
}
// 生成【日】下拉框的内容
function renderDaySelect(month){
$("#daySelect").empty();
var currentDays = computeDays(month);
for(var i = 1; i <= currentDays; i++){
$("#daySelect").append("<option>"+i+"</option>");
}
}
function computeDays(month){
if(month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12){
return 31;
}
else if(month == 4 || month == 6 || month == 9 || month == 11){
return 30;
}
else{
if( isLeapYear(currentYear)){
return 29;
}
else{
return 28;
}
}
}
function isLeapYear(year){
if(year % 400 == 0){
return true;
}
else if (year % 4 == 0 && year % 100 != 0)
{
return true;
}
else{
return false;
}
}
function changeMonth(){
currentMonth = $("#monthSelect").val();
renderDaySelect(currentMonth);
}
function changeYear(){
currentYear = $("#yearSelect").val();
changeMonth();
}
<script type="text/javascript">
var currentDate = new Date();
var currentYear;
var currentMonth;
$(function(){
renderYearSelect();
renderMonthSelect();
renderDaySelect(currentMonth);
})
// 生成【年份】下拉框的内容
function renderYearSelect(){
currentYear = currentDate.getFullYear();
for(var i = currentYear - 50; i < currentYear + 10; i++){
$("#yearSelect").append("<option>"+i+"</option>");
}
$("#yearSelect option[value="+currentYear+"]").attr("selected", "selected");
}
function renderMonthSelect(){
currentMonth = currentDate.getMonth() + 1;
for(var i = 1; i <= 12; i++){
$("#monthSelect").append("<option value="+i+">"+i+"</option>");
}
$("#monthSelect option[value="+currentMonth+"]").attr("selected", "selected");
}
// 生成【日】下拉框的内容
function renderDaySelect(month){
$("#daySelect").empty();
var currentDays = computeDays(month);
for(var i = 1; i <= currentDays; i++){
$("#daySelect").append("<option>"+i+"</option>");
}
}
function computeDays(month){
if(month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12){
return 31;
}
else if(month == 4 || month == 6 || month == 9 || month == 11){
return 30;
}
else{
if( isLeapYear(currentYear)){
return 29;
}
else{
return 28;
}
}
}
function isLeapYear(year){
if(year % 400 == 0){
return true;
}
else if (year % 4 == 0 && year % 100 != 0)
{
return true;
}
else{
return false;
}
}
function changeMonth(){
currentMonth = $("#monthSelect").val();
renderDaySelect(currentMonth);
}
function changeYear(){
currentYear = $("#yearSelect").val();
changeMonth();
}
</script>
<body>
<select id="yearSelect" style="width:100px;" onchange="changeYear()">
</select>
<select id="monthSelect" onchange="changeMonth()">
</select>
<select id="daySelect">
</select>
</body>
0 0
- 年月日三级联动(纯JS)
- js年月日三级联动
- js实现三级联动-年月日
- 日期的三级联动(纯js)
- 纯JS省市区三级联动
- 纯js三级联动菜单
- 纯JS省市区三级联动
- js实现年月日三级下拉菜单联动
- js实现年月日三级下拉菜单联动
- js日期选择年月日三级联动实现
- 年月日三级联动
- 年月日三级联动菜单
- JavaScript年月日三级联动
- 纯JS实现省市县三级联动
- JavaScript实现年月日三级联动
- JQuery年月日三级联动(生日)
- 实现年月日表单三级联动
- js--纯js实现省市地区三级联动
- ASCII表
- Create a thread demo
- 在线渗透工具大全
- First Bad Version
- JZOJ 3466.选课(select)
- 年月日三级联动(纯JS)
- javascript策略模式(strategy)
- LeetCode - 345. Reverse Vowels of a String
- 【3003】&&【9105】高精度求积 【高精度压位】
- 区分各关系
- 勾股定理一日一证连载44
- NOIP 2010 关押罪犯
- 主席树模板求不带修改的区间k大
- BZOJ2656 [Zjoi2012]数列(sequence)