多页报表非首页页眉内容修改问题（PDF Reactor环境）

针对PDF Reactor中报表子区域的后续页面添加"(Continued)"标记，核心是利用自定义页面序列区分报表区域内的页面，而非依赖整个文档的页码：

方法1：纯CSS实现（推荐） #

无需JavaScript，通过CSS Paged Media的自定义页面序列，精准定位报表区域内的非第一页：

1. HTML结构
   在页眉标题中添加隐藏的"(Continued)"标记：

   <div class="report-section">
     <!-- 报表页眉 -->
     <header class="report-header">
       <h2>季度销售报表 <span class="continued-tag">(Continued)</span></h2>
     </header>
     <!-- 报表多页内容 -->
     <div class="report-content">...</div>
   </div>
   

2. CSS样式

   /* 默认隐藏Continued标记 */
   .continued-tag {
     display: none;
   }
   
   /* 将报表区域绑定到自定义页面序列 */
   .report-section {
     page: report-subsection; /* 自定义页面序列名称 */
   }
   
   /* 仅在report-subsection序列的非第一页显示标记 */
   @page report-subsection :not(:first) {
     .continued-tag {
       display: inline;
     }
   }
   

原理说明 #

• page: report-subsection 将报表区域内的所有页面归为独立序列，与文档其他部分的页面隔离。
• @page report-subsection :not(:first) 仅选中该序列内的非第一页，无论序列在整个文档的第几页开始，都能精准生效。

方法2：PDF Reactor JavaScript API实现 #

若CSS方法存在兼容问题，可借助PDF Reactor的页面渲染回调API直接操作内容：

// PDF Reactor页面渲染完成回调
function onPageRendered(pageNumber, pageContext) {
  // 检查当前页面是否属于报表区域
  const headerEl = pageContext.querySelector('.report-header');
  if (!headerEl) return;

  // 获取报表区域内的页码（需先在CSS中定义计数器）
  const reportPageCounter = pageContext.getCounterValue('report-page');
  
  // 区域内第2页及以后添加标记
  if (reportPageCounter > 1) {
    const titleEl = headerEl.querySelector('h2');
    titleEl.textContent += ' (Continued)';
  }
}

// 配套CSS定义计数器
.report-section {
  counter-reset: report-page 0;
  page: report-subsection;
}

@page report-subsection {
  counter-increment: report-page;
}

注意事项 #

• 需在PDF Reactor配置中启用JavaScript支持。
• pageContext.getCounterValue() 是PDF Reactor专属API，可安全获取CSS计数器值，无需依赖getComputedStyle。

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