Edit Question - KnowledgeHub

Title Body

How do I modify this mathjax example to live preview while I type? Right now it only displays result after I have pressed enter. I would like to tweak it so that it works similar to how stackoverflow/math.stackexchange shows the preview when typing a question. <html> <head> <title>MathJax Dynamic Math Test Page</title> <script type="text/x-mathjax-config"> MathJax.Hub.Config({ tex2jax: { inlineMath: [["$","$"],["\$","\$"]] } }); </script> <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML-full"> </script> </head> <body> <script> // // Use a closure to hide the local variables from the // global namespace // (function () { var QUEUE = MathJax.Hub.queue; // shorthand for the queue var math = null; // the element jax for the math output. // // Get the element jax when MathJax has produced it. // QUEUE.Push(function () { math = MathJax.Hub.getAllJax("MathOutput")[0]; }); // // The onchange event handler that typesets the // math entered by the user // window.UpdateMath = function (TeX) { QUEUE.Push(["Text",math,"\\displaystyle{"+TeX+"}"]); } })(); </script> Type some TeX code: <input id="MathInput" size="50" onchange="UpdateMath(this.value)" /> <p> <div id="MathOutput"> You typed: ${}$ </div> </body> </html>

Tags (comma-separated) Cancel