Question

如果我的问题不属于此，请原谅我：

我刚陷入问题，我搜索了文档和小组，但我找不到任何问题的精确解决方案。

其实我想通过我的网页上的JavaScript一个一个地显示数学方程式。所以为了达到这个目的，我有一个拥有n个数学方程式的JSON数据，现在当我加载页面时，我需要只显示一个数学方程式，在这种情况下我得到了成功，但是当我在JSON数据上触发onclick事件并尝试显示下一个数学方程式然后MathJax库不适用于任何其他数学方程式，除了第一个数学方程式，它与页面加载一起显示。

我有以乳胶形式转换的数学方程式，我将这个乳胶放到我的MathJax网页上，我已经将MathJax库添加到我的网页中。需要帮忙。感谢。

我到目前为止尝试了以下代码

 <script type="text/javascript">
    (function () {
      var script = document.createElement("script");
      script.type = "text/javascript";
      script.src = "/static/MathJax-2.6-latest/MathJax.js";   // use the location of your MathJax

      var config = 'MathJax.Hub.Config({ config: "MathJax.js" }); ' +
                   'MathJax.Hub.Startup.onload();';

      if (window.opera) {script.innerHTML = config}
                   else {script.text = config}

      document.getElementsByTagName("head")[0].appendChild(script);
    })();
</script>

表单https://docs.mathjax.org/en/v1.0/dynamic.html，我也尝试配置https://docs.mathjax.org/en/v1.0/typeset.html但不成功。

修改即可。我有一个JSON数据

＆＃13;

[{"id":292,"equation":"\\(\\frac{1}{{1\\frac{1}{4}}} + \\frac{1}{{6\\frac{2}{3}}} - \\frac{1}{x} + \\frac{1}{{10}} = \\frac{{11}}{{12}},\\) What if the value of X?","eOption1":"\\(\\frac{{15}}{3}\\)","eOption2":"\\(\\frac{{20}}{{15}}\\)","eOption3":"\\(\\frac{{15}}{2}\\)","eOption4":"\\(\\frac{{12}}{{12}}\\)","Solution":"\\(\\frac{1}{{1\\frac{1}{4}}} + \\frac{1}{{6\\frac{2}{3}}} - \\frac{1}{x} + \\frac{1}{{10}} = \\frac{{11}}{{12}}\\)\r\\(\\frac{1}{{\\frac{5}{4}}} + \\frac{1}{{\\frac{{20}}{3}}} - \\frac{1}{x} + \\frac{1}{{10}} = \\frac{{11}}{{12}}\\)\r\\(\\frac{4}{5} + \\frac{3}{{20}} - \\frac{1}{x} + \\frac{1}{{10}} = \\frac{{11}}{{12}}\\)\r\\( \\Rightarrow \\frac{1}{x} = \\frac{4}{5} + \\frac{3}{{20}} + \\frac{1}{{10}} - \\frac{{11}}{{12}} = \\frac{{48 + 9 + 6 - 55}}{{60}}\\)\r\\( = \\frac{{63 - 55}}{{60}} = \\frac{8}{{60}} = \\frac{2}{{15}}\\)\r\\(\\frac{1}{x} = \\frac{2}{{15}} \\Rightarrow x = \\frac{{15}}{2}\\)"},

{"id":293,"equation":"\\(7.\\overline 7 \\) Find the value of?"","eOption1":"\\(\\frac{{80}}{9}\\)","eOption2":"\\(\\frac{{70}}{9}\\)","eOption3":"\\(\\frac{{60}}{9}\\)","eOption4":"\\(\\frac{{50}}{9}\\)","eOption5":"","eOption6":"","eOption7":"","eOption8":"","answer":"b","Solution":"\\(7.\\overline 7  = 7 + 0.\\overline 7  = 7 + \\frac{7}{9} = \\frac{{70}}{9}\\)","Solution":"\\(7.\\overline 7  = 7 + 0.\\overline 7  = 7 + \\frac{7}{9} = \\frac{{70}}{9}\\)"}...}]

＆＃13;

   <script type="text/javascript">
     var index = 0;
     var equationList = ${Question};
     $(document).ready(function() {
     qList = question;
     render();
     console.log('equationList--'+JSON.stringify(qList ));
});


and now my render function looks like following where i am displaying one equation 

function render() {
  //index=0;
  var list = qList[index];        

    $('#question').html(list.equation);

    $('#op1').html(list.eOption1);
    $('#op2').html(list.eOption2);
    $('#op3').html(list.eOption3);
    $('#op4').html(list.eOption4);
};

//onClick function()//

function displayNextEquestion() {
  index++;
  //index=1;
  render(); 
}
</script>

在上面的代码中，第一次在页面加载时调用render时，它会正确显示第一个问题，但是当函数＆＃34; displayNextEquestion（）＆＃34;称它无法正确显示第二个问题。

在我的网页上

＆＃13;

<script type="text/javascript">
    (function () {
      var script = document.createElement("script");
      script.type = "text/javascript";
      script.src = "/static/MathJax-2.6-latest/MathJax.js";   // use the location of your MathJax

      var config = 'MathJax.Hub.Config({ config: "MathJax.js" }); ' +
                   'MathJax.Hub.Startup.onload();';

      if (window.opera) {script.innerHTML = config}
                   else {script.text = config}

      document.getElementsByTagName("head")[0].appendChild(script);
    })();
</script>
<script type="text/javascript" src="https://cdn.mathjax.org/mathjax/2.0-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

＆＃13;

我正在使用最新的Chrome网页浏览器，希望这不会引起任何问题。感谢

以编程方式通过javascript One-By-One渲染公式生成的Latex

0 个答案: