zaneData是一個完全由原生javascript封裝的PC端日曆外掛，不依賴任何第三方外掛，功能全面，使用簡單.

使用方式

瀏覽器端使用

<!-- 引入相應的js和css -->
<link href="./dist/zane-calendar.min.css">
<script src="./dist/zane-calendar.min.js"></script>

<!-- 需要加時間外掛的輸入框 -->
<input type="" name="" id="zane-calendar">

初始化
zaneDate({
	elem:'#zane-calendar',
})
 

Webpack 使用

<!-- 安裝依賴 -->
npm install zane-calendar --save-dev

const zaneDate = require('zane-calendar') 或
import zaneDate from 'zane-calendar'

<!-- 需要加時間外掛的輸入框 -->
<input type="" name="" id="zane-calendar">

初始化
zaneDate({
	elem:'#zane-calendar',
})

所有引數說明(組合隨意)

{
	elem:'#zane-calendar',  控制元件的dom原生 注意：僅限制於id選擇器（必填參，其他引數皆為可選參）
	type:'day',   			可選型別 day year month time doubleday doubleyear doublemonth doubletime
	lang:'cn',   			可選擇語言型別 cn , en 
	width:280,  			外掛寬度配置   250 <= X <= 500
	height:300, 			外掛高度配置   250 <= X <= 350
	behindTop:10,   		外掛與輸入框的距離
	format:'yyyy-MM-dd HH:mm:ss',  時間格式化
	begintime:'',  			開始時間  （單選擇器預設選擇此項）
	endtime:'',             結束時間  （double選擇器需要）
	min:'',  				可選取時間最小範圍 1900-10-01
	max: '',  				可選取時間最大範圍 2099-12-31
	position:'fixed',  		定位方式  暫時只支援 fixed
	event:'click',   		事件方式 暫時只支援 click 
	zindex:100,   			z-index值
	showtime:true,  		是否顯示選擇時間
	showclean:true,  		是否顯示清除按鈕
	shownow:true,  			是否顯示當前按鈕
	showsubmit:true, 		是否顯示提交按鈕
	haveBotBtns:true, 		是否有底部按鈕列表
	mounted:()=>{}, 		外掛載入完成之後呼叫
	change:(fulltime,begintime,endtime)=>{}, 時間變更之後呼叫
	done:(fulltime,begintime,endtime)=>{},   選擇完成之後呼叫
}
 

承載元素

演示，詳見：