How to replace selection with Mathjax Javascript?
تبليغسؤال
يرجى شرح بإيجاز لمإذا تشعر أنك ينبغي الإبلاغ عن هذا السؤال.
Link to fiddle
I would like to create a button that replaces the selected text with a rendered Mathjax equation.
For HTML, I have:
<html>
<head>
<script type=”text/x-mathjax-config”>
MathJax.Hub.Config({
extensions: [“tex2jax.js”],
tex2jax: {inlineMath: [[“$”,”$”]]}
});
</script>
<script type=”text/javascript” async src=
“https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=
TeX-MML-AM_CHTML”></script>
</head>
<body>
$x^y$
<button id=”math” type=”button”>Math</button>
<button id=”italic” type=”button”>Italic</button>
<button id=”bold” type=”button”>Bold</button>
<div id=”editor” contenteditable=”true” spellcheck=”false”>
<p>press the button to display math like this: $a + b = c$</p>
</div>
</body>
</html>
And for JavaScript, I have:
$(‘#math’).click(function() {
const selection = window.getSelection();
const body = document.body;
p = document.createElement(‘p’);
const math = “$x + y$”;
p.innerHTML = math;
body.innerHTML = body.innerHTML.replace(selection, p);
MathJax.Hub.Queue([“Typeset”, MathJax.Hub, p]);
});
$(‘#italic’).click(function() {
document.execCommand(“italic”, false, null);
});
$(‘#bold’).click(function() {
document.execCommand(“bold”, false, null);
});
I am not getting the desired behavior. For example, if I select the first word, “press,” and click the Math button, the output is
What I want is to change the selected text to an arbitrary TeX equation.
Thanks
أضف إجابة