latex - 具有 MathJax 或类似功能的 Virtual Latex 数学键盘

Question

关闭。这个问题需要更多focused .它目前不接受答案。












想改善这个问题吗？更新问题，使其仅关注一个问题 editing this post .

4年前关闭。




Improve this question




我正在尝试创建一个虚拟数学键盘，就像 khanacademy.org 或 mathspace.co 或类似网站中的键盘一样，您可以在其中插入数学符号并写下它们来回答问题，如果您是学生，我该如何实现类似的东西？
在 khanacademy.org 中，他们使用的是 MathJax，我试图通读文档但没有运气。

Answer 1

好像MathQuill可能会帮助你实现你所需要的。默认情况下它不显示键盘，尽管它具有所有必需的输入功能。下面是他们来自主页的演示代码，它在代码段中运行良好。您可能希望使用来自 MathQuill docs 的选项进行配置.

键盘是单独的控件，实现起来非常简单，例如使用下面的 bootstrap 。键盘正在使用 .cmd(str) 向 MathQuill 字段提供输入命令(不要忘记返回焦点 .focus()) - 请参阅函数 input()。注意，要使用 bootstrap，你需要包含 bootstrap.css，如 bootstrap site 所述。 :

var mathFieldSpan = document.getElementById('math-field');
var MQ = MathQuill.getInterface(2);
var mathField = MQ.MathField(mathFieldSpan, {
  spaceBehavesLikeTab: true,
  handlers: {
    edit: function() {
      mathField.focus()
    }
  }
});

function input(str) {
  mathField.cmd(str)
  mathField.focus()
}

<link rel="stylesheet" href="http://mathquill.com/lib/mathquill.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://mathquill.com/lib/mathquill.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">

<p>Type math here: <span id="math-field"></span>
</p>
<div id="keyboard">
  <div class="btn-group" role="group" aria-label="math functions">
    <button type="button" class="btn btn-default" onClick='input("\\sqrt")'>√</button>
    <button type="button" class="btn btn-default" onClick= 'input("\\sin")'>sin</button>
    <button type="button" class="btn btn-default" onClick='input("\\cos")'>cos</button>
    <button type="button" class="btn btn-default" onClick='input("\\tan")'>tan</button>
  </div>
</div>