Fra*_*Vel 16 html javascript jquery mathjax
jsfiddle示例:https://jsfiddle.net/3qu846tu/
我正在尝试通过.html()更新MathJax-math,但是,似乎我的代码无效.我当前的代码看起来有点像这样,但它输出"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>
我尝试过不同的命令,但似乎都没有.["Rerender",MathJax.Hub]只是呈现"2 + 2 = 5",所以看起来像.html()被重置:
<script>
MathJax.Hub.Queue(["Rerender",MathJax.Hub]);
</script>
想要的结果看起来有点像这样(js省略),其中\ class {x} {}(和其他)可能会在不同的地方出现多次:
<span>You have chosen \(\class{x}{}\) and \(\class{y}{}\)</span>
$$\class{x}{}+\class{y}{}=\class{z}{}$$
有没有办法以这种方式渲染"1 + 2 = 3"？$('.'')可能会被更改多次,而不仅仅是一次.
弗兰克,使用以下代码:
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)才能编写值,然后您可以将文本框的值直接插入到公式中.
希望这可以帮助!