MathJax 和输入答案

【问题标题】：MathJax & InputsMathJax 和输入
【发布时间】：2021-05-08 13:12:34
【问题描述】：

在处理 MathJax 中的分数和方程式对齐时，我试图接收带有 HTML 的文本输入。当我这样做时，数学排版不起作用（如下所示）。有什么方法可以实现吗？

任何帮助将不胜感激！

<html>
<script>
MathJax = {
  tex: {
    inlineMath: [['$', '$'], ['\\(', '\\)']]
  }
};
</script>
<script id="MathJax-script" async
  src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js">
</script>
Let $f(x)=\frac{x}{3}$.</br>
Then, 
$f(9)=\frac{<input type="text" size="3">}{3}=3$.</br></br> 
</html>

【问题讨论】：

标签： javascript html input mathjax

【解决方案1】：

MathJax 不会处理包含 HTML 标记的数学运算（<br> 和 cmets 除外），因此您说得对，您所做的不会起作用。但是有一个漏洞可以用来获取输入字段，正如this post 中所讨论的那样，它使用 MathML <semantics> 标记将 HTML 放入表达式中。

<script>
MathJax = {
  tex: {packages: {'[+]': ['input']}},
  startup: {
    ready() {
      const Configuration = MathJax._.input.tex.Configuration.Configuration;
      const CommandMap = MathJax._.input.tex.SymbolMap.CommandMap;
      const TEXCLASS = MathJax._.core.MmlTree.MmlNode.TEXCLASS;
      
      new CommandMap('input', {input: 'Input'}, {
        Input(parser, name) {
          const xml = parser.create('node', 'XML');
          const id = parser.GetBrackets(name, '');
          const w = parser.GetBrackets(name, '5em');
          const value = parser.GetArgument(name);
          xml.setXML(MathJax.startup.adaptor.node('input', {
            id: id, value: value, style: {width: w}, xmlns: 'http://www.w3.org/1999/xhtml'
          }), MathJax.startup.adaptor);
          xml.getSerializedXML = function () {
            return this.adaptor.outerHTML(this.xml) + '</input>';
          }
          parser.Push(
            parser.create('node', 'TeXAtom', [
              parser.create('node', 'semantics', [
                parser.create('node', 'annotation-xml', [
                  xml
                ], {encoding: 'application/xhtml+xml'})
              ])
            ], {texClass: TEXCLASS.ORD})
          );
        }
      });
      Configuration.create('input', {handler: {macro: ['input']}});

      MathJax.startup.defaultReady();
    }
  }
};
</script>
<script id="MathJax-script" defer src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js"></script>

$$ \int_{\input[sub][1em]{0}}^{\input[sup][1em]{1}} \input[integrand][10em]{}\, dx$$

如果您经常使用它，可以将其制成正式的扩展。

【讨论】：

您好，请问MathJax 2.7.7有没有实现上面的功能？谢谢。