jquery – 让PageDown和MathJax一起工作

前端之家收集整理的这篇文章主要介绍了jquery – 让PageDown和MathJax一起工作前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在实施一个UI,它应该看起来像 math.stackexchange.com的UI:

>使用喜欢的Markdown像你习惯于stackoverflow
>使用MathJax在$ … $ – 符号之间解析公式。

所以我下载了PageDown演示并设置它,这很好。现在我尝试让每当< textarea>更改时动态加载MathJax。

MathJax得到了一个example这个方法,但我不能让它运行。这是我的代码如下所示:

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

每次触发按键事件时,此代码段都应更新预览。相反,在页面上,tex呈现良好,但是一旦我开始输入$ … $代码打印在预览框中。

解决方法

我已经创建了 a basic example,以便如何使用Stack Exchange的 mathjax-editing.js轻微修改来获得Pagedown和MathJax。

Stack Exchange的代码是基于Davide Cervone的,see his comment on another answer

该示例的代码可以在github查看。

猜你在找的jQuery相关文章