js 聯動實現日期選擇,一般用作生日

2022-02-25 07:52:37 字數 1610 閱讀 8233

實現目標:年月日三個select 輸入框,以及乙個hidden的input,通過js獲取input的值,如果有值切是日期格式,年月日select為input中的時間。否則為空。年缺省區間段為2023年到當今年份

本人使用了bootstrap,class請參照bootstrap的相關說明

下面是html 內容:

日 請輸入完整生日

下面是js 的實現:

//設定生日的轉換和獲取

var date=new date();

var year=date.getfullyear();

for(var i=year;i>=1900;i--)

$('#birthday_y').change(function()else

}}else

}}else

checkbirthday();

});$('#birthday_m').change(function()

}else

}break;

case "4":case "6":case "9": case "11":

if(birth_day=="")

}else

}break;

case "2":

if(birth_day=="")

}else

}}elseelse

}break;

default :break;}}

checkbirthday();

});$('#birthday_d').change(function()

);$('#birthday_d').focus(

function()});

//根據後台提供的資料,填充使用者的值

var birth_value=$('#birth').val();

if(birth_value!="")

}$("#birthday_m").find("option[value='"+b_month+"']").attr("selected","selected");

switch (b_month)

break;

case 4:case 6:case 9: case 11:

for (var i = 1; i <= 30; i++)

break;

case 2:

if((b_year%4==0 && b_year%100!=0) || (b_year%400==0))

}else

}break;

default :break;

}$("#birthday_d").find("option[value='"+b_day+"']").attr("selected","selected");

}//驗證生日是否輸入完整

function checkbirthday()else

}

日期選擇外掛程式(一般用於PC)

官方文件 小坑 限制時間選擇日期之後,即最大最小日期。遇到報 日期格式錯誤外掛程式會報這個。但是設定預設日期,第一次選擇的時候,格式校驗的時候報錯,就得修改。問題原因 選擇日期的時候會進行時間格式,以及時間最大最小範圍校驗。限制日期原因。解決辦法日期往後調1小時。設定時間預設值 只需給對應的輸入框v...

js與jQuery實現AJAX的一般方法

第一步,獲取xmlhttprequest物件 第二步,開啟與伺服器的連線 method 請求方式,可以是get或post url 所要訪問的伺服器中資源的路徑 如 day10 servlet aservlet async 是否為非同步傳輸,true 表示為非同步傳輸 一般都是true 第三步,傳送請...

原生JS實現日期選擇

js宣告方法 生日下拉框 把sel year sel month sel day修改即可 var birthday1 var opts extend defaults,options var yearselector opts.yearselector var monthselector opts....