移動端日期插件rolldate

rolldate爲上一版jquery移動端時間插件的全新版本，目前保留了上一版的大部分功能，而且增長了回調函數，以及主題風格選取，最重要的是解決了上一版本的遺留問題，依賴jquery、滑動不夠流暢、參數設計不夠合理等等。

開發日期選擇插件的緣由，一是基於移動端設計的日期選擇插件確實很少，二是大多支持的日期格式不夠豐富，也不夠靈活，這在多變的項目需求中，無疑是捉襟見肘的。

rolldate效果圖

​

支持豐富的日期格式，好比年月、年月日、年月日時分、年月日時分秒，後續還能夠擴展其餘格式，而且經過一系列回調函數，你能夠把日期修改成任意的格式展現，實現日期判斷等。

因爲有上一版本的積累，rolldate在開發之初就有了完整的設計方案，下面爲思惟導圖設計

​

插件詳細的參數如上方思惟導圖所示，這裏就不過多解釋。

使用方式

commonJs

var rolldate = require('rolldate');
new rolldate.Date({
  el:'#date'
})複製代碼

require.js

require(['rolldate'],function(rolldate){
  new rolldate.Date({
    el:'#date'
  })
})複製代碼

browser(瀏覽器直接引入)

new rolldate.Date({
  el:'#date'
})
複製代碼

完整調用示例

new rolldate.Date({
    el: '#date',
    format: 'YYYY-MM-DD',
    beginYear: 2000,
    endYear: 2100,
    theme: 'blue',
    tapBefore: function(el) {
        console.log('插件開始觸發');
    },
    moveEnd: function(el, iscroll) {
        console.log('滾動結束');
    },
    confirmBefore: function(el, date) {
        console.log('肯定按鈕觸發');
    },
    confirmEnd: function(el, date) {
        console.log('插件運行結束');
    }
})
複製代碼

演示地址(下方附二維碼)：rolldate，pc端建議使用手機模式打開

​

下載地址：github.com/weijhfly/ro…

若是你發現bug或者有更好的建議，歡迎在下方的評論區評論告知，不勝感激。