在做移動端的頁面時,用戶報名某個活動,需要填寫她的出生日期,這時可以用Mdate插件來完成,已達到更好的用戶體驗
操作很簡單,效果也不錯,是滑動選擇時間的,也有回調函數方便我們使用。只需要在頁面中引入iScroll.js和Mdate.js即可
使用說明
-
代碼:new Mdate("dateSelectorOne");
-
"dateSelectorOne"為你要顯示選擇后的日期的input,必填項;
-
Mdate的默認開始日期為:2000年1月1日,可自定義
-
Mdate的默認結束日期為:今天,可自定義
-
Mdate的默認日期格式為:xxxx年xx月xx日,可自定義
自定義項
12345678910111213141516171819new
Mdate(
"dateShowBtn"
, {
//"dateShowBtn"為你點擊觸發Mdate的id,必填項
acceptId:
"dateSelectorTwo"
,
//此項為你要顯示選擇后的日期的input,不填寫默認為上一行的"dateShowBtn"
beginYear:
"2002"
,
//此項為Mdate的初始年份,不填寫默認為2000
beginMonth:
"10"
,
//此項為Mdate的初始月份,不填寫默認為1
beginDay:
"24"
,
//此項為Mdate的初始日期,不填寫默認為1
endYear:
"2017"
,
//此項為Mdate的結束年份,不填寫默認為當年
endMonth:
"1"
,
//此項為Mdate的結束月份,不填寫默認為當月
endDay:
"1"
,
//此項為Mdate的結束日期,不填寫默認為當天
format:
"-"
//此項為Mdate需要顯示的格式,可填寫"/"或"-"或".",不填寫默認為年月日
})
效果如圖:
它提供給的回調函數可以在選擇完日期之后可以把選擇的日期拿出來,放到某個元素上或者作為變量參數。
附上下載鏈接:http://www.jq22.com/jquery-info18385