Question

我有一个scala函数创建一个数学表达式作为字符串每次点击按钮 $\log((3+x))$ 。我想在每次点击时调用mathjax以允许它渲染一个新的表达式我已经读过像MathJax.Hub.Queue这样的内容，但是如何在scala.js中使用它。

我的HTML文件：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Differantiator</title>
    <script type="text/x-mathjax-config">
    MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
 </script>
<script type="text/javascript" async
  src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
 </script>
</head>

<body>
  <form>
   Your expression to be differentiated:<br><br>
     <input type="text" name="expr" id="nodeValue">
     <input type="button"  onclick="addClickedMessage()"
           value="Differentiate!" id="click-me-button">
   </form> 
 <!-- Include Scala.js compiled code here -->
 <!-- Include JavaScript dependencies -->
  <script type="text/javascript" src="./target/scala-2.12/scala-js-tutorial-fastopt.js"></script>
 </body>
</html>

和我的scala文件，Op，Func，Rpn对象提供字符串：

package example

import org.scalajs.dom
import dom.document
import dom.html
import scalajs.js.annotation.JSExport
import scalatags.JsDom.all._
//import org.scalajs.jquery.jQuery
import scala.scalajs.js.annotation.JSExportTopLevel
import utils.Func
import utils.Rpn
import utils.Op

object App {
  def appendPar(targetNode: dom.Node, text: String): Unit = {
  val parNode = document.createElement("p")
  val textNode = document.createTextNode(text)
  parNode.appendChild(textNode)
  targetNode.appendChild(parNode)
 }

@JSExportTopLevel("addClickedMessage")
  def addClickedMessage(): Unit = {
  val expr:String = document.getElementById("nodeValue").asInstanceOf[html.Input].value.toString
  appendPar(document.body, "The expression is $" + Op.show(Rpn.rpnToFunc(expr)) + "$")
  appendPar(document.body, "The derivative is " +
  "$" +Op.show(Op.deriv(Rpn.rpnToFunc(expr), Func.Var("x")))+ "$")
  }

  def main(args: Array[String]): Unit = {
    addClickedMessage()
  }
 }

Answer 1

最简单的方法（使用js.eval() which is frowned upon in Scala.js除外）是使用js.Dynamic：

import js.Dynamic.{global => g}

g.MathJax.Hub.Queue(js.Array("Typeset", g.MathJax.Hub))

Answer 2

好吧，好吧，这很简单......只需添加

 js.eval("MathJax.Hub.Queue([\"Typeset\",MathJax.Hub])")

诀窍

Scala.js按钮重新加载mathjax

2 个答案: