Disable/Enable MathJax

755 views
Skip to first unread message

Basj

unread,
Nov 23, 2016, 10:15:55 AM11/23/16
to MathJax Users
Hello,
I would like to disable / enable Mathjax with a button, with Javascript.

Live demo here

After disabling, the DOM should look like this http://gget.it/hc9zrt05/testtt.html, like if MathJax wasn't here, the $, $$ will be displayed normally like text.

<body>
<p>
When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are
$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
</p>
</body>

After reenabling, the output should be rendered as math again.

How to do this?

Thanks in advance if you have an idea.

PS : What I've I tried:

* change renderer to PlainSource, but it's not what I'm looking for...

* MathJax.Hub.queue.pending = 0;
but it doesn't change anything even if I use method Rerender.

Peter Krautzberger

unread,
Nov 23, 2016, 11:20:00 AM11/23/16
to mathja...@googlegroups.com
Hi,

You might want to search the group for similar threads such as https://groups.google.com/forum/#!topic/mathjax-users/QVGbaUCP6fY/discussion.

Regards,
Peter.

--
You received this message because you are subscribed to the Google Groups "MathJax Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mathjax-users+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Davide Cervone

unread,
Dec 2, 2016, 8:35:00 AM12/2/16
to mathja...@googlegroups.com
Here is a sample that should do something like what you are after.

<!DOCTYPE html>
<html>
<head>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
  tex2jax: {inlineMath: [['$','$'],['\\(','\\)']]}
});
MathJax.Hub.Queue(function () {
  document.getElementById("toggle").disabled = false;
});
</script>
<script>
var isTypeset = true;
function ToggleMJ(button) {
  button.disabled = true;
  button.value = (isTypeset ? "Typeset Math" : "Remove Typeset Math");
  MathJax.Hub.Queue(
    (isTypeset ? RemoveMJ : ["Typeset",MathJax.Hub]),
    function () {
      isTypeset = !isTypeset;
      button.disabled = false;
    }
  );
}
function RemoveMJ() {
  var jax = MathJax.Hub.getAllJax();
  for (var i = 0, m = jax.length; i < m; i++) {
    var tex = jax[i].originalText;
    var isDisplay = (jax[i].root.Get("display") === "block");
    if (isDisplay) tex = "$$"+tex+"$$"; else tex = "$"+tex+"$";
    var script = jax[i].SourceElement();
    jax[i].Remove();
    var preview = script.previousSibling;
    if (preview && preview.className === "MathJax_Preview") 
      preview.parentNode.removeChild(preview);
    script.parentNode.insertBefore(document.createTextNode(tex),script);
    script.parentNode.removeChild(script);
  }
}
</script>
</head>
<body>

<p>
When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are
$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
</p>


<p>
<input id="toggle" type="button" value="Remove Typeset Math" onclick="ToggleMJ(this)" disabled />

</body>
</html>

This will remove the typeset math and the related MathJax elements when the button is pressed.  Pressing a second time causes MathJax to typeset again. 

Note, however, that MathJax inserts other elements in the page than just the typeset math.  These include stylesheets and other elements like the message area (at the lower left of the window).  These are note removed by this code, and if you want to be able to re-typeset the math, you can not remove them.

Also note that the original math delimiters are not retained by MathJax, so this code always uses $...$ for inline math, even if the original used \(...\).

Davide


--
You received this message because you are subscribed to the Google Groups "MathJax Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mathjax-user...@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages