如何删除用于打印的 tinymce 界面（仅显示 innerhtml）

Question

我有一个包含多个文本区域的页面，为此我将使用 tinymce。但是，我希望 tinymce 界面（所有按钮和菜单）不在打印时显示 (ctrl + p.) 我只想显示内容。使用 chrome 和 tinymce 版本：4.6.4-61.
这最好用 css 来完成吗？

Answer 1

使用 media queries 您可以专门为印刷内容设置样式。

一般方法是让一个 div 包含您要打印的所有内容，所有其他元素将设置为 display:none 并因此被隐藏。

@media print {
  /* hide everything */
  body * {
    visibility: hidden;
  }
  /* show everything in the div you want to print */
  #content-to-print,
  #content-to-print * {
    visibility: visible;
  }
  #content-to-print {
    position: absolute;
    left: 0;
    top: 0;
  }
}

您如何以及何时向打印 div 提供内容超出了此问题的范围。监听 ctrl + p 可能会很麻烦。恕我直言，最简单的方法是始终保留打印内容的卷影副本。您可以使用 @media screen 规则隐藏副本。

请参阅此 jsfiddle 以获取具体示例

如何删除用于打印的 tinymce 界面（仅显示 innerhtml）

how to remove tinymce interface (diplay only innerhtml) for printing

javascript

css

tinymce