自动SyntaxHighlighter与美化

Question

致力于一个学校项目，我们已经创建了一个论坛为基础的网站。我们使用PageDown和美化来处理文本。

但是，就像现在一样，我们必须在代码中使用<!--?prettify?-->，才能顺利地完成它，但是有什么方法可以告诉这个程序如何处理来自PageDown自动版的所有<pre>标记呢？

自动SyntaxHighlighter有什么缺点吗？

1#可能的解决方案，但不是我所想到的：

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

在预览上使用2#可能的解决方案，但不对用户友好：

我发现您可以调用一个函数prettyPrint();来突出显示带有class="prettyprint"的所有<pre>标记。因此，如果我们将解决方案与此结合起来，并添加一个setInterval()(或其他类似于.click的东西)来进行调用，我们将得到一些与Markdown预览一起工作的内容。我认为这种方式对用户不友好，因为它使用了大量的计算机功能(我认为)，如果你仔细观察，有时会在<pre>标签中看到一点闪烁。

这是代码：

var timer = setInterval(prettytimer, 0);

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

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

Answer 1

我所追求的3#解决方案：

这是我在预览处理程序站点和网页其余部分的解决方案1#中寻找的解决方案。也许有一些更好的方法，但这种方式会给你堆叠溢出的感觉。

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文件中:)