渲染MathJax以.html（）

的jsfiddle例如更新：https://jsfiddle.net/3qu846tu/渲染MathJax以.html（）

我試圖通過的.html（）的方式來更新MathJax，數學，但是，似乎我的代碼不能正常工作。我當前的代碼看起來有點像這一點，但它輸出「1 + 2 = 3」 聯合國呈現：

$$\class{x}{2}+\class{y}{2}=\class{z}{5}$$ 
<script> 
$('.x').html('1'); 
$('.y').html('2'); 
$('.z').html('3'); 
MathJax.Hub.Queue(["Typeset", MathJax.Hub]); 
</script>

我試過不同的命令，但沒有一個似乎工作。 [ 「重新呈現」，MathJax.Hub]剛剛呈現「2 + 2 = 5」，因此它似乎是html的（）被複位：

<script> 
MathJax.Hub.Queue(["Rerender",MathJax.Hub]); 
</script>

的希望結果將看起來有點像這樣（JS略），其中\類{X} {}（及其它）可以出現一次以上在不同的地方：

<span>You have chosen \(\class{x}{}\) and \(\class{y}{}\)</span> 
$$\class{x}{}+\class{y}{}=\class{z}{}$$

有呈現「1 + 2 = 3」這樣的任何方式？ $（'.x'）可能會多次更改，而不僅僅是一次。

來源

2016-08-03 Frank Vel

您可能想嘗試提供一個正確的示例。您的第一個代碼塊包含DOM內容（TeX字符串）和JavaScript代碼;這並沒有多大意義。我的猜測是你想在運行jQuery代碼之前進行排版（否則這些類沒有任何元素）。 –

@PeterKrautzberger TeX字符串確實包含這些類的元素，而.html（）確實替換了這些類中的符號;但是它是無條件的。重點是，一旦我嘗試「重新渲染」，.html（）被重置... –

再一次，使用snippets或jsbin顯示目前爲止的自包含示例將是一個好主意。 –

弗蘭克，使用下面的代碼：

HTML：

<html> 
<head> 

<script 
    src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML"> 
</script> 
</head> 
<body> 

<div id="formula"></div> 

A: <input type="text" id="valueA"> 
B: <input type="text" id="valueB"> 
C: <input type="text" id="valueC"> 

<p><input type="button" value="Update" onclick="DynamicMJ.update()" /></p> 

<script> 
var DynamicMJ = { 
    formula: document.getElementById("formula"), 

    update: function() { 
    var a = document.getElementById("valueA").value; 
     b = document.getElementById("valueB").value; 
    var c = document.getElementById("valueC").value; 
    var tex = "\\frac{"+a+"}{2}+ \\frac{"+b+"}{2} = \\frac{"+c+"}{5}"; 
    this.formula.innerHTML = "\\["+tex+"\\]"; 
    MathJax.Hub.Queue(["Typeset",MathJax.Hub,this.formula]); 
    } 
}; 
DynamicMJ.update(); 
</script> 

</body> 
</html>

說明：

你需要爲了使用HTML元素（在這個例子中DIV）到編寫值，然後您可以將文本框的值直接插入到公式中。

希望這會有所幫助！

來源

2016-08-11 19:39:07

這很接近，但變量可能出現在不同的div/spans中，所以如果可能的話，我想避免使用id，以避免爲每個變量設置太多的函數。 –

我不能接受這個作爲答案，因爲它不完整，但我認爲你應該得到賞金。你的回答仍然讓我看到我可以繼續。 –

謝謝弗蘭克，我很樂意提供幫助。也許如果你修改你的html，你可以找出正確的公式構建... –

渲染MathJax以.html（）

回答

相關問題