是一款依托于iScroll.js的日期选择小型插件,可滑动选择年、月、日,只适用于移动端。
操作简易,只需要在页面中引入iScroll.js和Mdate.js即可。
代码:new Mdate("dateSelectorOne");
"dateSelectorOne"为你要显示选择后的日期的input,必填项;
Mdate的默认开始日期为:2000年1月1日,可自定义
Mdate的默认结束日期为:今天,可自定义
Mdate的默认日期格式为:xxxx年xx月xx日,可自定义
自定义项
new 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需要显示的格式,可填写"/"或"-"或".",不填写默认为年月日 })
yearTag等变量不要依赖onScrollEnd中的取值,改成在sureBtn.onclick中实时获取
try { indexY = Math.ceil((yearScroll.y || 0) / 40 * -1 + 1); yearTag = yearUl.getElementsByTagName("li")[indexY].getAttribute("data-year"); } catch (err) { yearTag = that.beginYear } try { indexM = Math.ceil((monthScroll.y || 0) / 40 * -1 + 1); monthTag = monthUl.getElementsByTagName("li")[indexM].getAttribute("data-month") } catch (err) { monthTag = 1 } try { indexD = Math.ceil((dayScroll.y || 0) / 40 * -1 + 1); dayTag = dayUl.getElementsByTagName("li")[indexD].getAttribute("data-day") } catch (err) { dayTag = 1 }