I have to use HTML and JavaScript to design a website that have two input fields (a & b)and one action button, when the button is clicked, the section below would show the addition operation result (c) of a + b Here's what I have written
<script>
MathJax.Hub.Config({
tex2jax: {
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\[","\\]"] ]
}});
</script>
<script>
var asw = null;
var a=null;
var b=null;
function math(){
if(asw==null) asw=document.getElementById("answer");
a=document.getElementById("num1");
b=document.getElementById("num2");
a1 = parseInt(a.value);
b2 = parseInt(b.value);
c = a1+b2
asw.innerHTML = ("$$a+b=$$"+ c);
MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
MathJax.Hub.processSectionDelay=0;
};
</script>
<body>
<input type="button" onclick="math()" value="action">
a=<input type="text"id="num1"><br>
b=<input type="text"id="num2">
<div id="answer">
</div>
But in this case, if i input a=1, b=2, then the section will show only the addition result 3 in the normal way but not in the Mathjax; if I change asw.innerHTML = ("$$a+b=$$"+ c); into asw.innerHTML = ("$$a+b=$$"+ "$$c$$") ,then the result will show "a+b=c" in the mathjax, but not "a+b=3",so I want to ask that how to fix this problem?