javascript - MathJax Rendering HTML input fields in MathML - Stack Overflow

admin管理员组

文章数量:1024054

I'm attempting to include html input fields such as:

<input id="txtBox" type="text" size="1" style="text-align: center">

Within mathML equations. When I was originally creating and testing them locally on Firefox everything looked fine (natively renders the content). However, now that I've uploaded it to our site, which uses mathjax 2.01 to render the content I get 'Unknown node type: input' errors everywhere an input box should be. I currently have the boxes wrapped in

 <annotation> 

tags as described in another post here however I'm still receiving the same error.

<script type="math/mml">
<math>
  <mstyle displaystyle="true">
    <msup>
      <mi>x</mi>
      <semantics>
        <annotation-xml encoding="application/xhtml+xml">
         <input xmlns="" style="text-align:right" type="text" size="2" name="n" /></input>
    </annotation-xml>
  </semantics>
</msup>
<mo>+</mo>
<semantics>
  <annotation-xml encoding="application/xhtml+xml">
    <input xmlns="" type="text" size="2" name="b" /></input>
  </annotation-xml>
 </semantics>
</mstyle>
</math>
</script>

I'm attempting to include html input fields such as:

<input id="txtBox" type="text" size="1" style="text-align: center">

Within mathML equations. When I was originally creating and testing them locally on Firefox everything looked fine (natively renders the content). However, now that I've uploaded it to our site, which uses mathjax 2.01 to render the content I get 'Unknown node type: input' errors everywhere an input box should be. I currently have the boxes wrapped in

 <annotation> 

tags as described in another post here however I'm still receiving the same error.

<script type="math/mml">
<math>
  <mstyle displaystyle="true">
    <msup>
      <mi>x</mi>
      <semantics>
        <annotation-xml encoding="application/xhtml+xml">
         <input xmlns="http://www.w3/1999/xhtml" style="text-align:right" type="text" size="2" name="n" /></input>
    </annotation-xml>
  </semantics>
</msup>
<mo>+</mo>
<semantics>
  <annotation-xml encoding="application/xhtml+xml">
    <input xmlns="http://www.w3/1999/xhtml" type="text" size="2" name="b" /></input>
  </annotation-xml>
 </semantics>
</mstyle>
</math>
</script>

• javascript
• html
• input
• mathjax
• mathml

Share Improve this question Follow edited Jan 17, 2014 at 21:29 Glynbeard asked Jan 16, 2014 at 19:30 GlynbeardGlynbeard 1,38922 gold badges1919 silver badges3131 bronze badges 1

• If more information related to the problem is required, I can provide some pictures etc. as necessary. I'm still unable to fix this problem as of right now and seeking assistance. – Glynbeard Commented Jan 17, 2014 at 15:46

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

The MathML3.0 specification doesn't provide for HTML elements embedded directly in the MathML. HTML5 extended the definition to allow HTML tags within token elements in MathML, like <mtext>, for example. MathJax, however, was developed before HTML5 was plete, and it follows the MathML3.0 specification, so HTML tags are not allowed in general.

It is possible, however, to use the <semantics> and <annotation-xml> elements to include HTML within MathML. Note that <annotation> and <annotation-xml> can only appear as children of <semantics>, so you need both. Also, the body of an <annotation> tag is supposed to be plain text, not HTML tags, so to include HTML, you must use <annotation-xml> not <annotation>. Finally, you need to provide the encoding attribute for the <annotation-xml> tag, and the contents of the annotation needs an xmlns attribute to make sure that it is parsed in the popper namespace.

Here is an example that works with MathJax as well as native MathML in Firefox:

<script type="math/mml">
<math>
  <mstyle displaystyle="true">
    <msup>
      <mi>x</mi>
      <semantics>
        <annotation-xml encoding="application/xhtml+xml">
          <input xmlns="http://www.w3/1999/xhtml" style="text-align:right" type="text" size="2" name="n" />
        </annotation-xml>
      </semantics>
    </msup>
    <mo>+</mo>
    <semantics>
      <annotation-xml encoding="application/xhtml+xml">
        <input xmlns="http://www.w3/1999/xhtml" type="text" size="2" name="b" />
      </annotation-xml>
    </semantics>
  </mstyle>
</math>
</script>

We do hope to improve the situation in a future version of MathJax, but right now this is the only alternative. I hope that works for you.

I'm attempting to include html input fields such as:

<input id="txtBox" type="text" size="1" style="text-align: center">

Within mathML equations. When I was originally creating and testing them locally on Firefox everything looked fine (natively renders the content). However, now that I've uploaded it to our site, which uses mathjax 2.01 to render the content I get 'Unknown node type: input' errors everywhere an input box should be. I currently have the boxes wrapped in

 <annotation> 

tags as described in another post here however I'm still receiving the same error.

<script type="math/mml">
<math>
  <mstyle displaystyle="true">
    <msup>
      <mi>x</mi>
      <semantics>
        <annotation-xml encoding="application/xhtml+xml">
         <input xmlns="" style="text-align:right" type="text" size="2" name="n" /></input>
    </annotation-xml>
  </semantics>
</msup>
<mo>+</mo>
<semantics>
  <annotation-xml encoding="application/xhtml+xml">
    <input xmlns="" type="text" size="2" name="b" /></input>
  </annotation-xml>
 </semantics>
</mstyle>
</math>
</script>

I'm attempting to include html input fields such as:

<input id="txtBox" type="text" size="1" style="text-align: center">

Within mathML equations. When I was originally creating and testing them locally on Firefox everything looked fine (natively renders the content). However, now that I've uploaded it to our site, which uses mathjax 2.01 to render the content I get 'Unknown node type: input' errors everywhere an input box should be. I currently have the boxes wrapped in

 <annotation> 

tags as described in another post here however I'm still receiving the same error.

<script type="math/mml">
<math>
  <mstyle displaystyle="true">
    <msup>
      <mi>x</mi>
      <semantics>
        <annotation-xml encoding="application/xhtml+xml">
         <input xmlns="http://www.w3/1999/xhtml" style="text-align:right" type="text" size="2" name="n" /></input>
    </annotation-xml>
  </semantics>
</msup>
<mo>+</mo>
<semantics>
  <annotation-xml encoding="application/xhtml+xml">
    <input xmlns="http://www.w3/1999/xhtml" type="text" size="2" name="b" /></input>
  </annotation-xml>
 </semantics>
</mstyle>
</math>
</script>

• javascript
• html
• input
• mathjax
• mathml

Share Improve this question Follow edited Jan 17, 2014 at 21:29 Glynbeard asked Jan 16, 2014 at 19:30 GlynbeardGlynbeard 1,38922 gold badges1919 silver badges3131 bronze badges 1

• If more information related to the problem is required, I can provide some pictures etc. as necessary. I'm still unable to fix this problem as of right now and seeking assistance. – Glynbeard Commented Jan 17, 2014 at 15:46

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

The MathML3.0 specification doesn't provide for HTML elements embedded directly in the MathML. HTML5 extended the definition to allow HTML tags within token elements in MathML, like <mtext>, for example. MathJax, however, was developed before HTML5 was plete, and it follows the MathML3.0 specification, so HTML tags are not allowed in general.

It is possible, however, to use the <semantics> and <annotation-xml> elements to include HTML within MathML. Note that <annotation> and <annotation-xml> can only appear as children of <semantics>, so you need both. Also, the body of an <annotation> tag is supposed to be plain text, not HTML tags, so to include HTML, you must use <annotation-xml> not <annotation>. Finally, you need to provide the encoding attribute for the <annotation-xml> tag, and the contents of the annotation needs an xmlns attribute to make sure that it is parsed in the popper namespace.

Here is an example that works with MathJax as well as native MathML in Firefox:

<script type="math/mml">
<math>
  <mstyle displaystyle="true">
    <msup>
      <mi>x</mi>
      <semantics>
        <annotation-xml encoding="application/xhtml+xml">
          <input xmlns="http://www.w3/1999/xhtml" style="text-align:right" type="text" size="2" name="n" />
        </annotation-xml>
      </semantics>
    </msup>
    <mo>+</mo>
    <semantics>
      <annotation-xml encoding="application/xhtml+xml">
        <input xmlns="http://www.w3/1999/xhtml" type="text" size="2" name="b" />
      </annotation-xml>
    </semantics>
  </mstyle>
</math>
</script>

We do hope to improve the situation in a future version of MathJax, but right now this is the only alternative. I hope that works for you.

本文标签： javascriptMathJax Rendering HTML input fields in MathMLStack Overflow