使用 MathJax 获取 MathML 代码答案

【问题标题】：Get MathML code with MathJax使用 MathJax 获取 MathML 代码
【发布时间】：2015-08-28 19:34:43
【问题描述】：

我已经构建了一个表单来编写 LaTeX 表达式并使用 MathJax 呈现它们。为了加速 MathML 代码的复制，我编写了一个脚本，在另一个文本区域中显示 MathML 代码，就像你 can see here。

这是我的代码：

<!doctype html>
<html>
<head>
<title>LaTeX para Word</title>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
  showProcessingMessages: false,
  tex2jax: {
    inlineMath: [
      ['$','$'],
      [ '\\(', '\\)' ]
    ]
  },
  extensions: ['toMathML.js']
});

var math = null;
MathJax.Hub.queue.Push(function () {
  math = MathJax.Hub.getAllJax('MathOutput') [0];
});

window.UpdateMath = function (TeX) {
  MathJax.Hub.queue.Push(['Text', math, '\\displaystyle{' + TeX + '}']);
  document.getElementById('output').value = '<?xml version="1.0"?>' + math.root.toMathML("");
};

function selectTextarea(element) {
  var text = document.getElementById(element).select();
}
</script>
<script type="text/javascript" src="//cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML&locale=pt-br"></script>
</head>
<body>

<textarea id="MathInput" cols="60" rows="10" onkeyup="UpdateMath(this.value)"></textarea>

<div id="MathOutput">
$${}$$
</div>
<hr>
<br>
<textarea id="output" cols="60" rows="10" readonly="readonly"></textarea>
<br>
<button onclick="selectTextarea('output')">Selecionar código</button>
<script src="main.js"></script>
</body>
</html>

问题是当我更快地键入公式时，MathML 代码上不显示最后一个字符。有时，我必须在公式末尾添加一个空格才能获得正确的 MathML 代码。谁能给我一些提示来解决这个问题？

【问题讨论】：

未来注意事项：cdn.mathjax.org 即将结束生命周期，请查看 mathjax.org/cdn-shutting-down 以了解迁移提示。

标签： javascript mathjax

【解决方案1】：

问题是您将asynchronous 呼叫与synchronous 呼叫混合在一起。 Queue 工作 asynchronously，所以当你打电话给这个时：

MathJax.Hub.queue.Push(['Text', math, '\\displaystyle{' + TeX + '}']);

它不会等待实际渲染完成就转到下一行。所以这个调用在它完成之前被执行：

document.getElementById('output').value = '<?xml version="1.0"?>' + math.root.toMathML("");

解决此问题的一种方法是将输出更新也排队，您可以通过创建另一个处理输出并在渲染后对其进行排队的函数来做到这一点，因此只有在渲染完成时才会执行它.比如这样：

window.updateMathMl = function (math) {
    document.getElementById('output').value = '<?xml version="1.0"?>' + math.root.toMathML("");
};

window.UpdateMath = function (TeX) {
    MathJax.Hub.queue.Push(['Text', math, '\\displaystyle{' + TeX + '}'], [updateMathMl, math]);
};

https://jsfiddle.net/ew6vsqy8/1/

【讨论】：