Автоматическая подсветка синтаксиса с Prettify

Работаем над школьным проектом, где мы создаем веб-сайт на основе форума. Мы используем PageDown и Prettify для обработки текста.
но, как и сейчас, мы должны использовать <!--?prettify?-->в коде, чтобы сделать его красивым и гладким, но есть ли способ, которым мы можем сказать программе, чтобы обрабатывать все <pre>tags из PageDown автоматически с помощью prettify?

Есть ли недостатки у автоматического SyntaxHighlighter?

1 # Возможное решение, но не то, что я имел в виду:

Вы можете добавить $("pre").addClass("prettyprint"); в javascript. Этот код даст каждому предварительному тегу класс 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() не добавляет один и тот же класс дважды.


asp.net asp.net-mvc-5 syntax-highlighting pagedown prettify
person elektronet    schedule 21.05.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

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 :)

person elektronet    schedule 25.05.2016