MathJax not working with iFrame

问题

I am trying to call MathJax Function on iFrame by click event. Here is the code

html

<body onLoad="ifon();">
    <iframe name="richTextField" id="richTextField" style="border:#000000 1px solid; width:700px; height:300px;"></iframe>
<button onclick="refresh();"></button>
</body>

javascript

function ifon(){ 
    richTextField.document.designMode = 'On'; 
}
function refresh(){
    var richTextField = document.getElementById("richTextField");
    if(richTextField != null) {
        var get_iframe_text = richTextField.contentWindow.document.body.innerHTML;
        if(get_iframe_text.slice(-6) == "$$<br>"){
            //Trying to call MathJax on iFrame
            MathJax.Hub.Queue(["Typeset",MathJax.Hub,richTextField]);
            alert("Success");
        }
    }
}

The refresh() nested if condition will executed only if the last six character are $$<br>

Can any one help me how to call MathJax.Hub.Queue([]) on iFrame ?

回答1:

You can not use MathJax from outside the iframe to process math within the iframe. You need to load MathJax inside the iframe itself. You can still trigger MathJax from outside if you need to by calling the MathJax that is inside the iframe, provided that the contents is from the same domain as the container. Otherwise, you would need to set up an event listener and use postMessage to communicate with the iframe.