Milla Well Milla Well - 1 year ago 88
jQuery Question

let PageDown and MathJax work together

I am implementing a UI which is supposed to look pretty much like the one on

  1. Using fancy Markdown like you are used to on stackoverflow

  2. Parsing formulars using MathJax between

So I downloaded the PageDown demo and set it up, which works pretty well. Now I try to let MathJax being loaded dynamically everytime the

MathJax got an example for this approach but I'm not able to get it running. This is what 'my' code looks like:

<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=""></script>
<script type="text/x-mathjax-config">
tex2jax: {
inlineMath: [["$","$"],["\\(","\\)"]]
<script type="text/javascript" src="../../../mathjax-MathJax-07669ac/MathJax.js?config=TeX-AMS_HTML-full">
(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) {

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

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

This snippet should update the preview everytime the
event is fired. Instead on page onload the tex is rendered fine but as soon as I start typing the
code is printed in the preview box.

Answer Source

I've created a basic example for how to get Pagedown and MathJax working together using a slight modification of Stack Exchange's mathjax-editing.js.

Stack Exchange's code is based on Davide Cervone's, see his comment on another answer.

The code for the example can be viewed on github.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download