html - 如何将公式转换为 MathML 以便在网页中使用

Question

我花了几个小时在网上寻找解决方案，并且走了太多奇怪的小路......

假设我有一个公式: x^2 + 3x + 32

我想随机选择用文本框替换一部分公式(我可以这样做)

x^2 + [textbox]x +32

然后以良好的格式显示结果以供学生输入。 (我做不到)

我看过 MathJax 和 MathML，我认为如果我可以将结果转换为 mathml 格式，包括我排序的文本框。我已经可以使用 MathJax 很好地显示公式。

什么不起作用:

• 查找结果公式并用文本框替换(替换数字)

• 在结果公式上查找并用文本框替换(添加注释标签)

我试过的两种方法都会弄乱文本框的间距/剪辑，因此它无法使用。我认为唯一的方法是使用已经包含的文本框生成 MathML，而不是在之后尝试添加它。

但是我不知道怎么办？任何人都可以建议一种使用文本框生成 mathml 以用于 mathjax 的方法吗？

这是我到目前为止失败的尝试:

<script type="math/mml" id="scriptTag">
  <math>
    <mfrac>
      <msqrt>
        <mn>
          <semantics>
            <annotation-xml encoding='application/xhtml+xml'>
              <input xmlns='http://www.w3.org/1999/xhtml' type='text' size='4' />
            </annotation-xml>
          </semantics>
       </mn>
     </msqrt>
     <mn> 3 </mn>
    </mfrac>
  </math>
</script>

我可以使用本指南创建基本的(无文本框)mathml: http://www.xmlmind.com/tutorials/MathML/

Answer 1

我认为现代浏览器允许在 HTML5 中混合使用 HTML 元素和 MathML 元素:

<div>
<h2>Example 2</h2>
<div>
<math>
  <mrow>
    <mn><input type="text" size="4"></mn>
    <mo>*</mo>
    <mi>x</mi>
  </mrow>
</math>
</div>
</div>

<div>
<h2>Example 2</h2>
<div>
<math>
  <mrow>
    <mn><input type="text" size="4"></mn>
    <mo>*</mo>
    <mi>x</mi>
  </mrow>
</math>
</div>
</div>

这是一个上标示例，在 Firefox 中出现输入框:

<div>
<h2>Example msup</h2>
<div>
<math>
  <mrow>
    <msup>
      <mn>2</mn>
      <mn><input type="text" size="4"></mn>
    </msup>
  </mrow>
</math>
</div>
</div>

<div>
<h2>Example msup</h2>
<div>
<math>
  <mrow>
    <msup>
      <mn>2</mn>
      <mn><input type="text" size="4"></mn>
    </msup>
  </mrow>
</math>
</div>
</div>