Javascript/C# FullCalendar如何同时打印事件标题和描述

可以实现，你只需要调整FullCalendar的事件渲染逻辑和打印媒体查询样式即可，具体修改方案如下：

首先要将事件的description字段提前渲染到事件DOM节点中，非打印状态下可以隐藏该内容，仅在打印时展示。以FullCalendar v6为例，初始化配置示例：

document.addEventListener('DOMContentLoaded', function() {
  const calendarEl = document.getElementById('calendar');
  const calendar = new FullCalendar.Calendar(calendarEl, {
    // 其他原有配置保留
    eventContent: function(arg) {
      return {
        html: `
          <div class="event-title">${arg.event.title}</div>
          <div class="event-desc hidden-screen">${arg.event.extendedProps.description || ''}</div>
        `
      }
    }
  });
  calendar.render();
});

如果使用的是C#后端渲染场景，只需要在事件数据接口中同时返回title和description字段即可，前端逻辑无需额外调整。

补充非打印状态的隐藏样式，以及打印时的显示规则，同时避免FullCalendar内容打印截断：

/* 非打印状态下隐藏描述和打印无关元素 */
.hidden-screen {
  display: none !important;
}
@media print { 
  .visible-print {
    display: block !important;
  }
  .hidden-print {
    display: none !important;                
  }
  /* 打印时显示事件描述 */
  .event-desc {
    display: block !important;
    font-size: 0.8em;
    color: #666;
    margin-top: 2px;
  }
  /* 适配FullCalendar打印不截断 */
  #calendar {
    overflow: visible !important;
  }
  .fc-scrollgrid-section, .fc-scrollgrid, .fc-daygrid-body {
    height: auto !important;
  }
}

你当前的JavaScript和HTML代码存在未闭合的问题，修正后如下：

JS代码修正 #

$(function () {
  $('.printBtn').on('click', function () {
    window.print();
  });
});

按钮HTML修正 #

<button class="printBtn hidden-print" style="background-color: #28a745;color:white;border-radius:2px;border:none;width:75px;height:35px;">打印日历</button>

内容的提问来源于stack exchange，提问作者GiL