EasyUi日期控件datebox设置，只显示年月，也只能选择年月

1、input 代码

年月

1

2

3

4

5

6

7

8

2、设置只显示年月，只能选持年月：

$(function() {

$('#attYearMonth').datebox({

//显示日趋选择对象后再触发弹出月份层的事件，初始化时没有生成月份层

onShowPanel: function () {

//触发click事件弹出月份层

span.trigger('click');

if (!tds)

//延时触发获取月份对象，因为上面的事件触发和对象生成有时间间隔

setTimeout(function() {

tds = p.find('div.calendar-menu-month-inner td');

tds.click(function(e) {

//禁止冒泡执行easyui给月份绑定的事件

e.stopPropagation();

//得到年份

var year = /\d{4}/.exec(span.html())[0] ,

//月份

//之前是这样的month = parseInt($(this).attr('abbr'), 10) + 1;

month = parseInt($(this).attr('abbr'), 10);

//隐藏日期对象

$('#attYearMonth').datebox('hidePanel')

//设置日期的值

.datebox('setValue', year + '-' + month);

});

}, 0);

},

//配置parser，返回选择的日期

parser: function (s) {

if (!s) return new Date();

var arr = s.split('-');

return new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, 1);

},

//配置formatter，只返回年月 之前是这样的d.getFullYear() + '-' +(d.getMonth());

formatter: function (d) {

var currentMonth = (d.getMonth()+1);

var currentMonthStr = currentMonth < 10 ? ('0' + currentMonth) : (currentMonth + '');

return d.getFullYear() + '-' + currentMonthStr;

}

});

//日期选择对象

var p = $('#attYearMonth').datebox('panel'),

//日期选择对象中月份

tds = false,

//显示月份层的触发控件

span = p.find('span.calendar-text');

var curr_time = new Date();

//设置前当月

$("#attYearMonth").datebox("setValue", myformatter(curr_time));

})；1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

3、myformatter函数：

//格式化日期

function myformatter(date) {

//获取年份

var y = date.getFullYear();

//获取月份

var m = date.getMonth() + 1;

return y + '-' + m;

}1

2

3

4

5

6

7

8

4、运行效果

只显示年月

只能选择年月

说明：本文代码与参考连接不同的地方有两处理：

不同1、myformatter函数

转载为：

//格式化日期

function myformatter(date) {

var y = date.getFullYear();

var m = date.getMonth() + 1;

//var d = 1;

return y + ‘-‘ + (m < 10 ? (‘0‘ + m) : m);//+ ‘-‘ + (d < 10 ? (‘0‘ + d) : d);

}1

2

3

4

5

6

7

本文为：

//格式化日期

function myformatter(date) {

//获取年份

var y = date.getFullYear();

//获取月份

var m = date.getMonth() + 1;

return y + '-' + m;

}1

2

3

4

5

6

7

8

不同2、formatter

转截formatter:

formatter: function (d) {

return d.getFullYear() + ‘-‘ +(d.getMonth()+1);

}1

2

3

本文formatter:

formatter: function (d) {

var currentMonth = (d.getMonth()+1);

var currentMonthStr = currentMonth < 10 ? ('0' + currentMonth) : (currentMonth + '');

return d.getFullYear() + '-' + currentMonthStr;

}1

2

3

4

5