MonthBox for EasyUI 月份选择器

Download 下载 jquery.easyui.monthbox.js


Basic MonthBox


dynamically change options restore options

<script src="jquery.easyui.monthbox.js"></script>
<input class="easyui-monthbox" editable="fasle" data-options="separator:'', base: '201908', before:8, after:3" value="" />
<input class="easyui-monthbox" editable="fasle" data-options="separator:'', range: ['201901','201908','201909']" value="" />
<input class="easyui-monthbox" editable="fasle" data-options="separator:''" value="201906" />
<input class="easyui-monthbox" editable="fasle" value="2019-05" />
<input class="easyui-monthbox" editable="fasle" required="required" />
<input class="easyui-monthbox" />
<input class="easyui-monthbox" editable="fasle" data-options="showButtonCurrent:false,showButtonClean:false" />
<input class="easyui-monthbox" editable="fasle" data-options="showButtonCurrent:false,showButton:false" />

$(selector).monthbox('getValue')
$(selector).monthbox('setValue', '201908')
$(selector).monthbox('setValue', '2019-08')
$(selector).monthbox('setValue', '06/01/2017')
$(selector).monthbox('setValue', new Date('06/01/2017'))


// dynamically config
$(selector).monthbox({separator:'', range: ['201901','201908','201909']});

$(selector).monthbox({separator:'', base: '201905', before:3, after:3});

// restore
$(selector).monthbox({});

Download jquery.easyui.monthbox.js

Basic DateBox

Click the calendar image on the right side.