2016-03-25 12 views
0

私は数学の方程式を表示するためにMathJaxを使用しました。静的に書かれた数学では問題なく動作しています。しかし、動的に追加された数学のために働いていない。動的に動作しないMathJax

はここで私は2つのspan要素に数学を書いた私のコード

<body> 
    //Static 
     <div> 
      <span>\(x = {-b \pm \sqrt{b^2-4ac} \over 2a}\)</span>     
     </div> 
     //Dynamic 
     <div id="dynamic-pan"> 

     </div> 
     <script type="text/javascript" src="js/jquery.js"></script> 
     <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_CHTML"></script> 

     <script type="text/javascript"> 
      $(document).ready(function(){ 
       $('#dynamic-pan').empty(); 
       $('#dynamic-pan').append('<span>\(x = {-b \pm \sqrt{b^2-4ac} \over 2a}\)</span>'); 
      }); 
     </script> 
</body> 

です。最初は静的に宣言され、2つ目は文書準備関数で動的に追加されます

問題を解決するために手伝ってください。 MathJaxはTypeset()へのコールの時に動作している場合があるので、

答えて

2

は、あなたがそのキューに追加する必要があり、Typeset()方法で行われている未処理の数学を探すためにMathJaxを指示する必要があり

$(document).ready(function() { 
 
    var $el = $('#dynamic-pan') 
 
    $el.empty() 
 
    $el.append('<span>\\(x = {-b \\pm \\sqrt{b^2-4ac} \\over 2a}\\)</span>') 
 
    MathJax.Hub.Queue(['Typeset', MathJax.Hub, $el[0]]); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_CHTML"></script> 
 

 
//Static 
 
<div> 
 
    <span>\(x = {-b \pm \sqrt{b^2-4ac} \over 2a}\)</span> 
 
</div> 
 
//Dynamic 
 
<div id="dynamic-pan"></div>

詳しく

編集のためにthis documentを参照してください:文字\は特別meaninを持っていますgの文字列を(これは、次のcharをエスケープする)この動作を避けるためには、を最終文字列に使用することを確認してください。

+0

それが動作していません.. – Madhu

+0

あなたの文字列の一部の文字がエスケープされ、私の答えを結果で更新しました –

関連する問題