如何使用PHP获得样式HTML来打印文件 - How to get Styled HTML to print a file with PHP

我使用这个:http://softwaremaniacs.org/soft/highlight/en/来突出显示代码，如下所示:http://www.u4ik.us/code，如果您输入一些代码并点击go，它会突出显示它。你可以改变颜色等等。我想知道我是否可以以某种方式导出它(生成一个文件下载)作为一个"随机字符串数字。html"或。rtf将包含用户输入的代码，在他们选择的颜色，以便他们可以离线使用它?

下面是我的脚本:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0    Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>U4iK_HaZe Code Highlighter</title>
<head>
  <title>highlight.js test</title>
  <meta charset="utf-8">
  <link rel="stylesheet" title="Default" href="styles/default.css">
  <link rel="alternate stylesheet" title="Dark" href="styles/dark.css">
  <link rel="alternate stylesheet" title="FAR" href="styles/far.css">
  <link rel="alternate stylesheet" title="IDEA" href="styles/idea.css">
  <link rel="alternate stylesheet" title="Sunburst" href="styles/sunburst.css">
  <link rel="alternate stylesheet" title="Zenburn" href="styles/zenburn.css">
  <link rel="alternate stylesheet" title="Visual Studio" href="styles/vs.css">
  <link rel="alternate stylesheet" title="Ascetic" href="styles/ascetic.css">
  <link rel="alternate stylesheet" title="Magula" href="styles/magula.css">
  <link rel="alternate stylesheet" title="GitHub" href="styles/github.css">
  <link rel="alternate stylesheet" title="Brown Paper" href="styles/brown_paper.css">
  <link rel="alternate stylesheet" title="School Book" href="styles/school_book.css">
  <link rel="alternate stylesheet" title="IR Black" href="styles/ir_black.css">
  <style>
    body {
      font: small Arial, sans-serif;
    }
    h2 {
      font: bold 100% Arial, sans-serif;
      margin-top: 2em;
      margin-bottom: 0.5em;
    }
    table {
      width: 100%; padding: 0; border-collapse: collapse;
    }
    th {
      width: 12em;
      padding: 0; margin: 0;
    }
    td {
      padding-bottom: 1em;
    }
    td, th {
      vertical-align: top;
      text-align: left;
    }
    pre {
      margin: 0; font-size: medium;
    }
    #switch {
      overflow: auto; width: 57em;
      list-style: none;
      padding: 0; margin: 0;
    }
    #switch li {
      float: left; width: 10em;
      padding: 0.1em; margin: 0.1em 1em 0.1em 0;
      background: #EEE;
      cursor: pointer;
    }
    #switch li.current {
      background: #CCC;
      font-weight: bold;
    }
    .test {
      color: #888;
      font-weight: normal;
      margin: 2em 0 0 0;
    }
    .test var {
      font-style: normal;
    }
    .passed {
      color: green;
    }
    .failed {
      color: red;
    }
    .code {
      font: medium monospace;
    }
    .code .keyword {
      font-weight: bold;
    }
  </style>
  <script src="highlight.pack.js"></script>
  <script>
  hljs.tabReplace = '    ';
  hljs.initHighlightingOnLoad();
  </script>
  <script>
  // Stylesheet switcher © Vladimir Epifanov <voldmar@voldmar.ru>
  (function(container_id) {
      if (window.addEventListener) {
          var attach = function(el, ev, handler) {
              el.addEventListener(ev, handler, false);
          }
      } else if (window.attachEvent) {
          var attach = function(el, ev, handler) {
              el.attachEvent('on' + ev, handler);
          }
      } else {
          var attach = function(el, ev, handler) {
              ev['on' + ev] = handler;
          }
      }

      attach(window, 'load', function() {
          var current = null;
          var info = {};
          var links = document.getElementsByTagName('link');
          var ul = document.createElement('ul')
          for (var i = 0; (link = links[i]); i++) {
              if (link.getAttribute('rel').indexOf('style') != -1
                  && link.title) {
                  var title = link.title;
                  info[title] = {
                  'link': link,
                  'li': document.createElement('li')
                  }
                  ul.appendChild(info[title].li)
                  info[title].li.title = title;
                  info[title].link.disabled = true;
                  info[title].li.appendChild(document.createTextNode(title));
                  attach(info[title].li, 'click', (function (el) {
                      return function() {
                          current.li.className = '';
                          current.link.disabled = true;
                          current = el;
                          current.li.className = 'current';
                          current.link.disabled = false;
                      }})(info[title]));
              }
          }
          current = info['Default']
          current.li.className = 'current';
          current.link.disabled = false;
          ul.id = 'switch';
          container = document.getElementById(container_id);
          container.appendChild(ul);
      });
  })('styleswitcher');
  </script>
</head>
<body>
<script type="text/javascript">
            String.prototype.escape = function() {
                return this.replace(/&/gm, '&amp;').replace(/</gm, '&lt;').replace(/>/gm, '&gt;');
            }
            function doIt() {
                var viewDiv = document.getElementById("highlight-view");
                var t1 = document.getElementById("t1");
                var t2 = document.getElementById("t2");
                var selector = document.getElementById("langSelector");
                var selectedLang = selector.options[selector.selectedIndex].value.toLowerCase();
                if(selectedLang) {
                    viewDiv.innerHTML = '<pre><code class="'+selectedLang+'">'+t1.value.escape()+"</code></pre>";
                } else { // try auto
                    viewDiv.innerHTML = '<pre><code>' + t1.value.escape() + "</code></pre>";
                }
                hljs.highlightBlock(viewDiv.firstChild.firstChild);
                t2.value = viewDiv.innerHTML;
            }
            function copyToBuffer(textToCopy) {
                if (window.clipboardData) { // IE
                    window.clipboardData.setData("Text", textToCopy);
                } else if (window.netscape) { // FF
                    // from http://developer.mozilla.org/en/docs/Using_the_Clipboard
                    netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
                    var gClipboardHelper = Components.classes["@mozilla.org/widget/clipboardhelper;1"].getService(Components.interfaces.nsIClipboardHelper);
                    gClipboardHelper.copyString(textToCopy);
                }
            }
        </script>
        <script type="text/javascript">
            var langSelectorHtml = '<label>Language <select id="langSelector">';
            langSelectorHtml += '<option value="">Auto</option>';
            for (var i in hljs.LANGUAGES) {
                if (hljs.LANGUAGES.hasOwnProperty(i))
                    langSelectorHtml += '<option value='"'+i+''">'+i.charAt(0).toUpperCase()+i.substr(1)+'</option>';
            }
            langSelectorHtml += '</select></label>';
            document.write(langSelectorHtml);
        </script>
        <table width="100%">
            <tr>
                <td><textarea rows="20" cols="50" id="t1"></textarea></td>
                <td><textarea rows="20" cols="50" id="t2"></textarea></td>
            </tr>
            <tr>
                <td>Paste Code Here:</td>
            </tr>
        </table>
        <table width="98%">
            <tr>
                <td width="50%"><input type="button" value="Highlight &rarr;" onClick="doIt()"/></td>
                <td width="50%" align="right"><input type="button" value="Copy to Clipboard" onClick="copyToBuffer(document.getElementById('t2').value);"/></td>
            </tr>
        </table>
<div id="styleswitcher">
  <h2>Styles</h2>
</div>
        <p>Code:        </p>
        <div id="highlight-view"></div>
</body>
</html>

据我所知，您的问题是您的服务器上没有突出显示的代码(在您的php脚本中)。

在演示中，右边有这个文本区，它显示高亮显示的代码。

你可以很容易地在你的页面上包含这个文本区域作为隐藏的，并结合它与下载按钮和表单。如果有人按下下载按钮，代码将提交到您的php脚本(在服务器上)，您可以从那里将其作为可下载文件提供。

使用如下代码，以便在提供textarea内容时显示保存对话框:

header('Content-type: text/html');
header('Content-Disposition: attachment; filename="random-string-o-numbers.html"');