加载javascript后加载Mathjax [英] load Mathjax after loading javascript

查看:376
本文介绍了加载javascript后加载Mathjax的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这里是我简单的 HTML 代码

 < html> 
< head>
< script type =text / javascript
src =http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML>
< / script>
< script>
函数gup(名称)
{
name = name.replace(/ [\ [] /,\\\ [)。replace(/ [\] ] / \\\]);
var regexS =[\\?&]+ name +=([^&#] *);
var regex = new RegExp(regexS);
var results = regex.exec(window.location.href);
if(results == null)
return;
else
返回结果[1];
}
< / script>
< / head>
< body>
< p>这是加载正确的行\ [\ frac {x + y} {z} \]< / p>
< p id =step1>< / p>
< script>
var x = gup('x');
var y = gup('y');
var z = gup('z');
var text =这是不显示正确的行+\ [\frac {+ x +++ y +} {+ z +} \];
document.getElementById(step1)。innerHTML = text;
< / script>
< / body>
< / html>

当我加载这个html文件并通过url发送参数时,比如

  sample.html?x = 1& y = 2& z = 3 

第一句显示正确的表格并加载 Mathjax ,但第二句NOT。这是因为 Mathjax 在java脚本代码之前加载。你知道如何在 Javascript 之后加载 Mathjax 吗?

解决方案

您可以尝试使用带有回调的JavaScript加载器来加载MathJax并在回调中运行代码。
请参阅 https://github.com/niftylettuce/javascript-async-callback例如。

编辑:

 < html> 
< head>
< script type =text / javascriptsrc =http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML>< / script>
< script type =text / javascriptsrc =http://code.jquery.com/jquery-1.8.0.min.js>< / script>
< script>
函数gup(名称)
{
name = name.replace(/ [\ [] /,\\\ [)。replace(/ [\] ] / \\\]);
var regexS =[\\?&]+ name +=([^&#] *);
var regex = new RegExp(regexS);
var results = regex.exec(window.location.href);
if(results == null)
return;
else
返回结果[1];
}
< / script>

< script>
$(function(){
var x = gup('x');
var y = gup('y');
var z = gup('z' );
var text =这是不显示正确的行< - 现在确定+\\ [\\frac {+ x +++ y + } {+ z +} \\;
document.getElementById(step1)。innerHTML = text;
});
< / script

< / head>
< body>
< p>这是加载正确的行\ [\ frac {x + y} {z} \]< / p>
< p id =step1>< / p>
< / body>
< / html>


here is my simple HTML code

<html>
<head>
<script type="text/javascript"
 src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
<script>
function gup( name )
{
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1];
}
</script>
</head>
<body>
<p>This is the line that load correct  \[ \frac{x+y}{z} \]</p>
<p id="step1"></p>
<script>
var x = gup('x');
var y = gup('y');
var z = gup('z');
var text = "This is the line that NOT show correct" + "\[ \frac{" + x + " + " + y + "}{" + z +"}\]";
document.getElementById("step1").innerHTML= text;
</script>
</body>
</html>

when I load this html file and send parameters by url like

sample.html?x=1&y=2&z=3

the first sentence shows correct form and load Mathjax but the second sentence NOT. it is because Mathjax load before the java script code. do you know how to load Mathjax after Javascript?

解决方案

You can try using a JavaScript loader with a callback to load MathJax and run your code in the callback. See https://github.com/niftylettuce/javascript-async-callback for example.

EDIT:

<html>
<head>
<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script>
function gup( name )
{
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1];
}
</script>

<script>
$(function() {
  var x = gup('x');
  var y = gup('y');
  var z = gup('z');
  var text = "This is the line that NOT show correct <-- It's OK now" + "\\[ \\frac{" + x + " + " + y + "}{" + z +"} \\]";
  document.getElementById("step1").innerHTML= text;
});
</script

</head>
<body>
<p>This is the line that load correct  \[ \frac{x+y}{z} \]</p>
<p id="step1"></p>
</body>
</html>

这篇关于加载javascript后加载Mathjax的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆