fullcalendar中title内容过长显示不全的问题

添加属性:

eventRender: function (event, element) {
    element.html(event.title);           
}

 

页面详细代码:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp"%>
<link href='${staticPath }/static/fullcalendar/fullcalendar.css' rel='stylesheet' />
<script src='${staticPath }/static/fullcalendar/lib/moment.min.js'></script>
<script src='${staticPath }/static/fullcalendar/fullcalendar.js'></script>
<style>
#calendar {
    max-width: 1200px;
    margin: 0 auto;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
    $(".fc-right").hide();
    var data=${list};
    var data1=${listqingjia};
    var dataevents=[];
    var i=0;
    $.each(data,function(index,element){
        if(element.status==1){
            dataevents[i] = {title: element.periodName+":"+element.attendance_time+",方式:"+element.typeName, start:element.dateTime};
            i++;
        }
        if(element.status!=1)
        {dataevents[i] = {title: element.periodName+":"+element.attendance_time+",方式:"+element.typeName, start:element.dateTime,backgroundColor: '#fdcccd'};
            i++;
        }
    });
    $.each(data1,function(a,b){
            dataevents[i] = {title: b.typeName+':'+b.time_star+'至'+b.time_end,start:b.dateStar,end:b.dateEnd};
            i++;
        
    });
    $('#calendar').fullCalendar({
        editable: false,
        eventLimit: true, // allow "more" link when too many events
        events:dataevents,
        eventRender: function (event, element) {//title以HTML显示(换行)
            element.html(event.title);           
        }

    });

    
});

    function addDate(date, days) {
        if (days == undefined || days == '') {
            days = 1;
        }
        var date = new Date(date);
        date.setDate(date.getDate() + days);
        var month = date.getMonth() + 1;
        if (month < 10)
            month = "0" + month;
        var day = date.getDate();
        if (day < 10)
            day = "0" + day;
        return date.getFullYear() + '-' + month + '-' + day;
    }
</script>
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
        <li class="fa fa-remove"></li>
    </button>
    
    <h5 class="modal-title">考勤详情</h5>
</div>
<div class="modal-body">
    <div id='calendar'></div>
</div>
<script>
    
</script>

  • 3
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值