пусть PageDown и MathJax работают вместе

Я реализую пользовательский интерфейс, который должен выглядеть примерно так же, как наmath.stackexchange.com:

Using fancy Markdown like you are used to on stackoverflow Parsing formulars using MathJax between $...$-signs.

Поэтому я скачал демо PageDown и настроил его, который работает довольно хорошо. Теперь я стараюсь, чтобы MathJax загружался динамически каждый раз, когда<textarea>изменения.

MathJax получилпример для этого подхода, но я не могу запустить его. Это то, что "мой" код выглядит так:

     <link rel="stylesheet" type="text/css" href="demo.css" />

    <script type="text/javascript" src="../../Markdown.Converter.js"></script>
    <script type="text/javascript" src="../../Markdown.Sanitizer.js"></script>
    <script type="text/javascript" src="../../Markdown.Editor.js"></script>

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.js"></script>
    <script type="text/x-mathjax-config">
      MathJax.Hub.Config({
        tex2jax: {
          inlineMath: [["$","$"],["\\(","\\)"]]
        }
      });
    $("#wmd-input").keypress(function(event){
        UpdateMath($(this).val());
    });
    </script>
    <script type="text/javascript" src="../../../mathjax-MathJax-07669ac/MathJax.js?config=TeX-AMS_HTML-full">
    </script>
</head>
<body>
    <script>
      (function () {
        var QUEUE = MathJax.Hub.queue;  // shorthand for the queue
        var math = null;                // the element jax for the math output.

        QUEUE.Push(function () {
          math = MathJax.Hub.getAllJax("#wmd-preview")[0];
        });

        window.UpdateMath = function (TeX) {
          QUEUE.Push(["Text",math,"\\displaystyle{"+TeX+"}"]);
        }
      })();
    </script>

    <div class="wmd-panel">
        <div id="wmd-button-bar"></div>
        <textarea class="wmd-input" id="wmd-input" value=""/>

    </textarea>
    </div>
    <div id="wmd-preview" class="wmd-panel wmd-preview"></div>
    <br /> <br />
    <script type="text/javascript">(function () {
                 var converter1 = Markdown.getSanitizingConverter();
            var editor1 = new Markdown.Editor(converter1);
            editor1.run();
        })();
    </script>
</body>

Этот фрагмент должен обновлять предварительный просмотр каждый раз, когдаkeypress событие запущено. Вместо этого на странице загрузки текст отображается нормально, но как только я начинаю набирать$...$код напечатан в окне предварительного просмотра.

 Inquilabi07 мар. 2018 г., 13:12
Здравствуйте, если вы успешно сделали то, что хотели, могу ли я дать ссылку на ваш блог?

Ответы на вопрос(4)

MathJax + PageDownкак суть, УвидетьМета пост Больше подробностей.

 06 сент. 2016 г., 20:58
Я немного смущен кодом в этой сути. Альтернатива сmarked библиотека кажется более доступной с точки зрения исходного кода. Есть ли у вас какие-либо комментарии по выбору одного из этих двух?
Решение Вопроса

основной пример о том, как заставить Pagedown и MathJax работать вместе, используя небольшую модификацию Stack ExchangeMathJax-editing.js.

Код Stack Exchange основан на Davide Cervone's,см. его комментарий к другому ответу.

Код для примера можно посмотреть наGitHub.

 21 нояб. 2016 г., 19:18
Спасибо за это @AntonioVargas, но все еще есть раздражающее мерцание с математическим рендерингомeach time we press a key, Это не присутствует, когда мы пишем в Math.SE, например. У тебя есть идея?
 21 нояб. 2016 г., 19:22
Что-то еще: в вашем живом примере URL для .js устарел. Было бы хорошо, если бы вы могли обновиться с новым источником .js.
 21 нояб. 2016 г., 23:06
Вот самая новая версия:dev.stackoverflow.com/content/js/mathjax-editing.js (14kB). Для дальнейшего использования это версия gdalgas (12kB):gist.github.com/gdalgas/a652bce3a173ddc59f66, Это версия DavidCervone (7 кБ):math.union.edu/~dpvc/transfer/mathjax/mathjax-editing.js, Это версия AntonioVargas (12 кБ):github.com/szego/pagedown-mathjax-example/blob/master/…
 13 июн. 2017 г., 00:12
Страница примера - это не что иное, как две текстовые области, которые ничего не делают.
 21 нояб. 2016 г., 19:38
@Basj, Math.SE недавно был обновлен новым скриптом рендеринга. Он тоже мерцал (и я использовал старую версию кода в моем примере). Если вы можете получить копию их нового скрипта mathjax-edit.js, вы можете просто вставить его в мой пример, чтобы получить новое поведение.

пример, который вы позаимствовали, является примером обновленияsingle уравнение, а не абзацы, которые включают в себя несколько уравнений. Для этого вам нужно будет рассмотретьвторой динамический пример (из MathJaxстраница примеров). Вы должны получить сообщение об ошибке в консоли браузера, которое будет связано сnull значение (math будетnull если вы не начнете с какой-то математики в редакторе для начала).

Но есть и вторая проблема, которая заключается в том, что редактор wmd будет обновлять область wmd-preview, и вам следует согласовать ее с обновлением MathJax, так как в противном случае он может изменить содержимое div, пока над ним работает MathJax , Wmd также более умен в том, что касается обновлений, а не только при каждом нажатии клавиш (например, клавиши со стрелками не вызывают обновления), поэтому координация также будет более эффективной. SE-версия wmd имеет зацепки, позволяющие вам это сделать, и я подозреваю, что и та, которую вы используете, тоже делает.

Наконец, вам придется проделать большую работу по защите математики от движка Markdown, чтобы такие вещи, как подчеркивание и обратный слеш, не обрабатывались Markdown, когда они появляются в математике. Это немного сложно, но без этого вы столкнетесь с множеством проблем, связанных с неправильной обработкой кода TeX.

Чтобы разобраться с последними двумя проблемами, вы можете рассмотреть вопрос окод, используемый MSE для подключения MathJax в WMD. Возможно, это даст вам некоторые подсказки о том, как это сделать.

 27 июн. 2012 г., 23:42
Я думаю, что код, который он прокомментировал довольно хорошо. Основная идея состоит в том, чтобы убрать математику (и заменить ее токенами), затем запустить Markdown, а затем заменить токены исходной математикой. Хуки для вставки этого в рабочий процесс wmd находятся в вызове prepareWmdForMathJax. Вы можете, вероятно, использовать свойeditor1 для EditorObject. Материал в нижней части файла исправляет MathJax, чтобы разрешить его отмену во время работы. Есть некоторые процедуры для решения проблем в IE или других браузерах, но остальное, я надеюсь, должно быть достаточно прокомментировано, чтобы рассказать, что происходит.
 Milla Well27 июн. 2012 г., 22:55
Отлично, вы мне очень помогли! Мой код теперь работает так, как вы предсказывали: оба работают нормально, но иногда wmd - первый, а иногда mathjax, и каждый перезаписывает другой. Вы разместили эту ссылку на MSE, но у меня возникли трудности с ее чтением! Каковы основные уловки, сделанные в этом фрагменте или: Вы знаете где-нибудь о SSCCE?
 11 окт. 2012 г., 14:04
@AronAhmadia, похоже, они перешли на миниатюрную версию, поэтому читать ее уже не легко. Я изменил ссылку на их новую копию, но вы можете использовать некоторыеde-obfuscation site если вы хотите прочитать это. Я также поставилoriginal copy кода, который я предоставил им на сервере для вас. Они внесли несколько изменений, чтобы решить проблему сsplit() в IE (думаю, так и было) и для предотвращения проблемы с обратными галочками, содержащими знаки доллара.
 11 окт. 2012 г., 12:46
@DavideCervone - ваша ссылка на код, используемый MSE, кажется, не работает, изменился ли URL?
 11 окт. 2012 г., 15:52
@DavideCervone - мы используем этот код для улучшенного рендеринга MathJax в блокноте IPython. Я не осознавал, что вы были первоначальным автором (на самом деле, я решил проблему расщепления с помощью улучшенного парсера регулярных выражений, любезно предоставленного Левитаном). Вы не против выпустить этот код под BSD? Вы можете увидеть текущий пул-запрос здесь:github.com/ipython/ipython/pull/2349 (ваш код находится в mathjaxutils.js).

отмеченный (другая библиотека Markdown, чем Pagedown) и "MathJax" в "живой редактор markdown + mathjax".

Посмотреть демо:http://kerzol.github.io/markdown-mathjax/editor.html

И получите источник:https://github.com/kerzol/markdown-mathjax

 04 февр. 2014 г., 22:19
Добро пожаловать на Stackoverflow. Я думаю, что это должен быть комментарий, потому что он не отвечает на вопрос. У вас недостаточно репутации, чтобы оставить комментарий. Пожалуйста, будьте терпеливы, пока вам не будут предоставлены необходимые права.
 06 сент. 2016 г., 23:11
@ I & # x15F; & # x131; k Существует также концептуальная разница между Marked и PageDown. Marked - это «полнофункциональный анализатор и компилятор уценки, написанный на JavaScript», но PageDown - редактор уценки. Иногда люди предпочитаютMarked.
 07 сент. 2016 г., 00:03
Кто-нибудь сумел на самом деле, что упоминалосьSE gist работать, кто-нибудь кроме SE, видимо? Я все еще не могу заставить его работать.
 30 мар. 2015 г., 00:59
Хорошее решение @SergeyKirgizov, но медленное: время между написанием и рендерингом составляет около 1 секунды. Это не там наmath.stackexchange.com
 04 февр. 2014 г., 22:39
да, это должен быть комментарий. Можно ли преобразовать мое сообщение из & quot; ответа & quot; "комментировать"? Я знаю, что не могу, но может модератор может?

Ваш ответ на вопрос