Question

在我们创建基于论坛的网站的学校项目上工作。我们正在使用PageDown和Prettify来处理文字但是就像现在我们必须在代码上使用来使它更好，更顺畅，但是我们可以通过某种方式告诉程序处理来自PageDown自动的所有<pre>标记美化？

自动SyntaxHighlighter是否有一些缺点？

1＃可能的解决方案，但不是我的想法：

您可以将$("pre").addClass("prettyprint");添加到javascript。这段代码将为每个pre标签提供prettyprint类，但是这个简短的代码在Markdown预览中不起作用，所以对我来说这只是一个50％的解决方案。

2＃预览时可能的解决方案，但不是用户友好的：

我发现您可以调用函数prettyPrint();以使用<pre>突出显示所有class="prettyprint"标记。因此，如果我们将解决方案与此相结合并添加setInterval()（或类似.click之类的其他内容）来进行调用，我们将获得适用于Markdown预览的内容。我相信这种方式不是用户友好的，因为它使用了很多电脑电源（我认为），如果你仔细观察，有时会在<pre>标签中看到一点点闪烁。
这是代码：

var timer = setInterval(prettytimer, 0);

function prettytimer() {
    $("pre").addClass("prettyprint");
    prettyPrint();
};

如果有人想知道为什么没有.removeClass()或hasClass()检查，那是因为.addClass()没有两次添加相同的课程。

Answer 1

3＃解决方案我去了：

这是我在预览处理程序站点中使用的解决方案，以及在网页其余部分上的解决方案 1＃。可能有一些更好的方法，但这种方式会给你Stack Overflow的感觉。

var timer;

//If the code button have been pressed {}
$("#wmd-code-button").click(function () {
    clearTimeout(timer);
    timer = setTimeout(prettytimer, 3000);
});

//when on key have been released inside textarea
$(".wmd-input").on("keyup", function () {
    clearTimeout(timer);
    timer = setTimeout(prettytimer, 3000);
});

//If `timer` reach 3000 (3 seconds) execute this
function prettytimer() {
    $("pre").addClass("prettyprint");
    prettyPrint();
};

如果您使用的是pageDown Markdown，那么您不必对此代码进行任何更改，只需将其复制到您的javascript文件中即可：）

具有Prettify的自动语法高亮显示器

1＃可能的解决方案，但不是我的想法：

2＃预览时可能的解决方案，但不是用户友好的：

1 个答案:

3＃解决方案我去了：