Search code examples
javascriptjqueryhtmliframemathjax

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 ?

Solution

  • At last I found a solution for this problem. Just replacing iFrame with HTML5 ContentEditale Div.

    Now it is working Fine...