javascript - 如何删除用于打印的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举个具体的例子