单击某个元素时如何呈现MathJax?

时间:2016-09-23 12:42:27

标签: javascript html mathjax

我有一个输入字段,我在其中键入LaTeX命令,当我单击按钮时必须将其呈现为MathJax。我使用textContent属性将div元素的内容设置为输入字段中输入的内容。但是,浏览器不会呈现MathJax并将div的内容显示为LaTeX命令。我想这可能是因为MathJax是在加载文档时呈现的。有什么方法可以在单击按钮时呈现MathJax吗?我不了解jquery或任何其他JavaScript库。有没有办法在不使用它们的情况下这样做或者是否有必要使用它们?



<head>
  <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_CHTML">
    <!-- The source is used to render mathjax -->
    function dispMJ() {
      var a = document.getElementById("mj").value;
      document.getElementById("disp").textContent = a;
    }
  </script>
</head>

<body>
  <input type="text" id="mj">
  <input type="button" value="render MJ" onclick="dispMJ();">
  <div id="disp"></div>

</body>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

你应该使用QUEUE告诉MathJax重新渲染div,在这里查看一个完整的例子http://codepen.io/damianfabian/pen/EgWEpv?editors=1000

UpdateMath = function () {
    var TeX = document.getElementById("MathInput").value;
    QUEUE.Push(["Text",math,"\\displaystyle{"+TeX+"}"]);
}