Racive JS和使用LaTeX输入更新MathJax

Ractive JS and updating MathJax with LaTeX input?

本文关键字：输入 更新 MathJax LaTeX JS Racive      更新时间：2023-09-26

我正在尝试让ractive.js动态更新MathJax。

现在我知道你可以用触发MathJax重新加载

MathJax.Hub.Queue.Push(["Typeset",MathJax.Hub]);

因此，我将其绑定到观察回调：

  ractive.observe('input', function (input) {
    ractive.set('output', input * 2);
    MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
  });

但是当我尝试用'begin{equation} {{output}} 'end{equation}渲染MathJax时它保持在其初始值。

测试用例

奇怪的是，它确实得到了初始值，只是没有得到更新。

有什么想法吗？

EDIT:它似乎添加了一整堆嵌套的MathJax_MathContainer元素，每个调用一个。

JsFiddle演示与Peter Krautzberger的建议-似乎仍然不起作用

问题是MathJax从DOM中删除了元素，因此Racive无法再更新它们。这可以通过代替使用将LaTeX封装在<script type="math/tex; mode=display" id="foo">元素中的MathJax搜索（例如$$）来解决。这将阻止替换，因为MathJax可以在内部处理脚本元素。

现在您可以观察变量并使用MathJax.Hub.Queue(["Typeset",MathJax.Hub, "foo"]); 触发重新绘制

非常感谢Peter Krautzberger的建议/解决方案。

@wrongusername我没有Racive的任何经验，大约3年前我才使用MathJax，但我尝试过Reprocess而不是Typeset，它很有效。我认为您应该使用Reprocess，因为您的输入已更改。从文件上看，

从文档或DOM元素（或元素（如果是元素数组），然后处理数学又来了，一切都重新排版。

请参阅此处更新的JSFiddle。

你只需要更换

MathJax.Hub.Queue(["Typeset", MathJax.Hub, "foo"]);

带有

MathJax.Hub.Queue(["Reprocess", MathJax.Hub, "foo"]);

希望能有所帮助。

相关文章：