如何调用shinyjs代码仅打印Shiny应用的第一页

要实现仅打印第一页且消除空白页，核心是通过精准的CSS打印规则控制打印区域，配合JS触发打印操作。以下是具体方案：

核心问题分析 #

空白页通常由以下原因导致：

• 页面元素的margin/padding超出打印纸范围
• body/html的默认高度设置触发额外分页
• 未隐藏页面中超出第一页的冗余内容

解决方案代码 #

Shiny应用完整示例 #

library(shiny)

ui <- fluidPage(
  # 自定义打印专属样式
  tags$style(HTML("
    @media print {
      /* 重置页面基础样式，消除多余边距与滚动 */
      body, html {
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
      }
      /* 隐藏非打印必需元素（按需调整选择器） */
      .navbar, .sidebar, footer, .print-btn {
        display: none !important;
      }
      /* 强制内容容器在单页内，禁用分页符 */
      .print-content {
        height: 95vh !important;
        page-break-after: avoid !important;
        page-break-inside: avoid !important;
      }
      /* 明确打印纸张规格 */
      @page {
        size: A4 portrait;
        margin: 1cm;
      }
    }
  ")),
  
  # 需打印的内容容器（标记专属类）
  div(class = "print-content",
      h1("第一页打印内容"),
      p("此处放置你需要打印的核心内容，确保整体高度适配A4单页"),
      # 模拟超出第一页的冗余内容（会被打印样式屏蔽）
      div(style = "height: 150vh; background: #f5f5f5;",
          p("这部分内容不会出现在打印件中")
      )
  ),
  
  # 打印触发按钮
  actionButton("print_btn", "打印第一页", class = "print-btn")
)

server <- function(input, output, session) {
  # 点击按钮触发打印指令
  observeEvent(input$print_btn, {
    session$sendCustomMessage("start_print", list())
  })
  
  # 注册JS打印触发逻辑
  tags$script(HTML("
    Shiny.addCustomMessageHandler('start_print', function() {
      window.print();
    });
  "))
}

shinyApp(ui, server)

关键调整说明 #

1. 基础样式重置：在@media print规则中强制body/html高度为100%，清除默认边距和滚动条，避免内容溢出触发分页。
2. 内容容器限制：给需打印内容添加print-content类，设置高度为95vh（预留打印边距），同时禁用分页符，确保内容完全在单页内。
3. 冗余元素隐藏：手动隐藏导航栏、侧边栏、打印按钮等非必需元素，减少无效内容占用打印空间。
4. 纸张规格定义：通过@page明确打印纸张尺寸和边距，避免浏览器自动调整导致的空白区域。

额外优化建议 #

• 若内容仍有溢出，可微调print-content的height值（比如90vh），适配不同内容高度。
• 检查页面中是否存在position:fixed定位的元素，这类元素可能在打印时产生额外空白，需在打印样式中设置display:none。

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