Home/ Questions/Q 8585625
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-11T22:06:45+00:00

I’m building what is basically a mathematic text editor in an HTML file. My

  • 0

I’m building what is basically a mathematic text editor in an HTML file. My goal is to allow the user to display numbers and MathML symbols in a textarea, but completely without the use of a physical keyboard. On the bottom of the page I have a mock keyboard made of buttons with numbers and arithmetic symbols. When the user clicks these buttons, the corresponding number or symbol will then appear inside the textarea. So far, I can get this to work with numbers, but not the MathML symbols. Is there any way to get these symbols to show up inside the textarea?

To make this easier to understand, here’s a function called by one of the buttons to insert the number 1 into the textarea:

function insertOne(mctextarea,oneText='1'){
    document.getElementById('mctextarea').value += oneText;
}

And here’s a function I tried writing to insert a square root sign into the textarea:

function insertSqrt(mctextarea,sqrt=<math xmlns="http://www.w3.org/1998/Math/MathML" display="inline"><mrow><msqrt>x</msqrt></mrow></math>){
    document.getElementById('mctextarea').value += sqrt;
}

…which obviously doesn’t work, but I don’t know where to begin trying to display MathML in the textarea.

Be aware that I’ve only been using Javascript for about 3 weeks now, so I’m still learning the ropes. 🙂

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Ben, I am very new to stackoverflow.com so I can not post a picture of what this code renders. I am using opensource MathJax.js to render mathematical function in HTML. You can find better examples at http://www.MathJax.org.

    PS: I am still learning how to format answers correctly 😉
    Code Example:

    <!DOCTYPE html>
<html lang="en" >
  <head>
    <title></title>
    <meta charset="UTF-8" />
  </head>
  <body>
    <p>Have you seen MathJax.js at www.mathjax.org</p>
    <p>$$
      \large
      \begin{align&#42;}
      &amp; J(\theta) = \dfrac{1}{m} \sum&#95;{i=1}^m Cost((h&#95;
      \theta(x^{(i)}),y^{(i)}) \newline
      &amp; Cost((h&#95;\theta(x),y) = -log(h&#95;\theta(x)) \; &amp; \text{if y = 1}\newline
      &amp; Cost((h&#95;\theta(x),y) = -log(1-h&#95;\theta(x)) \; &amp; \text{if y = 0}\end{align&#42;}
      $$
    </p>

    <script type='text/javascript' src='http://cdn.mathjax.org/mathjax/late/MathJax.js?config=TeX-AMS-MML_HTMLorMML'></script>
  </body>
</html>
    • 0