MathJax将不会在iframe中呈现

Question

我正在尝试让MathJax在iframe中进行渲染。 这是一个简单的例子。 运行小提琴时，您可以在底部看到“正在加载MathJax”横幅，但iframe中的文本不会呈现。 （应该像附加的图像一样渲染）。

我的代码在这里转载：

的HTML：

<iframe id="my-frame" srcdoc="<div>This is \(\mu_s\). </div>">

javascript：

var mathJax = 'https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML-full',
            script = document.createElement('script'),
            initScript = document.createElement('script');

        script.type = 'text/javascript';
        script.src = mathJax;

        initScript.type = 'text/javascript';
        initScript.text = '$(document).on("ready", function () {MathJax.Hub.Queue(["Typeset",MathJax.Hub]);});';

$('#my-frame').contents().find('head').append(script);
$('#my-frame').contents().find('body').append(initScript);

我在这里查看了SO问题，但是我的情况似乎有所不同（因为我是从iframe中调用MathJax Typeset的）。 同样，这个旧的Google线程表明我需要在iframe中加载MathJax脚本，而我已经在这样做了。 MathJax文档指示我应该调用MathJax.Hub.Queue(["Typeset",MathJax.Hub]); 当尝试将动态内容的呈现排队时，我正在这样做（尽管我怀疑我可能不需要手动排队“排版”？）。 根据建议，将MathJax加载到每个iframe的<head>脚本中。

不太确定还有什么尝试，任何帮助将不胜感激。 我在控制台中看到的错误是Uncaught ReferenceError: MathJax is not defined ，这使我认为它无法在iframe中正确加载...

谢谢！

Answer 1

您的代码有几个问题。 首先，您不需要initScript ，因为MathJax会自动运行一次（即使您这样做了，因为jQuery并未加载到iframe中，您还是无法执行$(document).on() ）。 另外，您应该在iframe的文档中创建脚本元素，而不是在外部文档中创建脚本元素（它们是不同的）。

否则，您处在正确的轨道上，但事实证明jQuery使您不知所措。 append()调用做了一些有趣的事情，MathJax最终在外部窗口而不是内部窗口中运行。 我不确定这是怎么发生的，但是解决方案是为此使用常规的appendChild()方法而不是jQuery。 所以如果你用

var doc = $('#my-frame').contents()[0];

var script = doc.createElement('script');
script.type = 'text/javascript';
script.src = 'https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML-full';

// $('#my-frame').contents().find('head').append(script);  // this is the line that is causing trouble.
doc.head.appendChild(script);

它应该为您工作（它对我有用）。

Answer 2

我通过编辑源文档本身来完成此操作，而不是试图在事实发生之后注入MathJax 。

<iframe id="my-frame" srcdoc="<html><head><script src='https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML-full'></script></head><body><div>This is \(\mu_s\). </div></body></html>">

MathJax将不会在iframe中呈现

问题描述

2 个解决方案

解决方案1
1 已采纳 2015-08-20 12:03:59

解决方案2
0 2015-08-18 18:16:17

MathJax将不会在iframe中呈现

问题描述

2 个解决方案

解决方案1 1 已采纳 2015-08-20 12:03:59

解决方案2 0 2015-08-18 18:16:17

解决方案1
1 已采纳 2015-08-20 12:03:59

解决方案2
0 2015-08-18 18:16:17