curious - 4 years ago 212
Javascript Question

I am loading a new page with jQuery.load. However, the contents are being treated weirdly somehow. On the original page, I have some code to format latex commands with MathJax:

<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-MML_HTMLorMML">
</script>


And this works fine for the original file. However, when I click on my link and insert more HTML into the page:

<script>
$(document).ready(function(){$("#link").click(function(){
$("#myDiv").load("test.html"); }); }); </script>  Now the special characters are not formatted by MathJax and are just displayed as-is. Answer Source Carols 10cents is close, but you need to do the MathJax.Hub.Queue() call in a callback from the jQuery load() so that the typesetting isn't performed until after the file is loaded. (As it stands, it happens immediately after the file load is requested, even though the file may not be available yet). Something like <script>$(document).ready(function(){
$("#link").click(function(){$("#myDiv").load("test.html", function () {
MathJax.Hub.Queue(["Typeset", MathJax.Hub, "myDiv"]);
});
});
});
</script>


See the examples from a talk I gave at the JMM in January 2013 for more details and the solution to other situations.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download