如何向PHPMyAdmin添加Mathjax支持

Question

我使用MySQL DBMS存储我的数据。我有很多数学数据要输入数据库。我想以乳胶形式输入数学数据是最佳选择。（如果您认为其他解决方案会更好，请随时建议）。我们使用PHPMyAdmin将数据输入MySQL。现在是因为我们正在输入大量的数学数据。最好看看我们正在进入什么。与math.stackexchange.com的实时预览完全相似。这就是Mathjax的用武之地。现在最大的问题是如何将Mathjax支持集成到PHPMyAdmin？

如果你想在这里找到一个例子我们想要输入数据库的东西：

  

在第一年的微积分中，我们定义了间隔，例如$（u，v）$和   $（u，\ infty）$。这样的间隔是$ a $ if的\ emph {邻域}   $ a $在区间内。学生应该意识到$ \ infty $是   只是一个符号，而不是一个数字。这很重要，因为我们很快就会   介绍$ \ lim_ {x \ to \ infty} f（x）$等概念。

     

当我们引入导数[\ lim_ {x \ to a} \ frac {f（x） -   f（a）} {x - a}，]我们假设函数是定义的和连续的   在$ a $附近。

Answer 1

我找到了解决方案。您可以使用this link下载修改后的PHPMyAdmin发行版（它不会永远可用）。我将描述我所做的改变。如果你愿意，你可以自己重复一遍。

这就是它的样子：

当您创建新条目或编辑现有条目时，该脚本将在“插入”选项卡上运行。该脚本适用于所有textareas（多行编辑字段）。在textarea中更改某些内容并将焦点移出它（通过单击）后，将在此textarea上创建文本块。 Textarea的内容复制到此块中。如果有一些公式，它们将由MathJax呈现。请耐心等待：第一次使用起来会很慢，公式将在几秒钟后更换。

步骤1.下载最新版本的PHPMyAdmin。

我已经使用最新版本的PHPMyAdmin（现在为3.5.1）测试了我的代码。它可以使用 旧版本，但我没有检查。

步骤2.下载最新版本的MathJax并将其解压缩到<PHPMyAdmin_Directory>/js/mathjax/distrib。

您可以从official site下载MathJax 2.0。在名为js/mathjax/distrib的PHPMyAdmin目录文件夹中创建，并将MathJax解压缩到此文件夹中。您现在必须拥有现有文件js/mathjax/distrib/MathJax.js。

步骤3.将配置文件js/mathjax/distrib/config/default.js复制到js/mathjax/distrib/config/myconfig.js。

步骤4.在myconfig.js文件中更改您网站的设置。

找到这个部分：

tex2jax: {

    //
    //  The delimiters that surround in-line math expressions.  The first in each
    //  pair is the initial delimiter and the second is the terminal delimiter.
    //  Comment out any that you don't want, but be sure there is no extra
    //  comma at the end of the last item in the list -- some browsers won't
    //  be able to handle that.
    //
    inlineMath: [
//    ['$','$'],      // uncomment this for standard TeX math delimiters
      ['\\(','\\)']
    ],

从您的文字示例中我发现您需要将此设置更改为：

tex2jax: {
    inlineMath: [
      ['$','$'], ['[', ']'], 
      ['\\(','\\)']
    ],

步骤5.使用以下内容创建文件js/mathjax/1.js：

$(function() {
  var preview_number = 0;
  $("textarea").change(function(e) {
    var textarea = $(e.target);
    var d = textarea.prev();
    if (!d.hasClass("mathjax_preview")) {
      preview_number++;
      var d = $("<div class='mathjax_preview' " +
         "style='padding: 5px; color: black; background: #eee; border: 1px solid #888;'" +
         "></div>");
      d.attr("id", "mathjax_preview_" + preview_number);
      d.insertBefore(textarea);
    } 
    d.text(textarea.val());
    MathJax.Hub.Queue([ "Typeset", MathJax.Hub, d.attr("id") ]);
  });
});

步骤6.修改tbl_change.php。

在根PHPMyAdmin目录中打开tbl_change.php文件，找到此部分：

$GLOBALS['js_include'][] = 'functions.js';
$GLOBALS['js_include'][] = 'tbl_change.js';
$GLOBALS['js_include'][] = 'jquery/jquery-ui-1.8.16.custom.js';
$GLOBALS['js_include'][] = 'jquery/timepicker.js';
$GLOBALS['js_include'][] = 'gis_data_editor.js';

在此下方再添加两行：

$GLOBALS['js_include'][] = 'mathjax/distrib/MathJax.js?config=myconfig';
$GLOBALS['js_include'][] = 'mathjax/1.js';

Answer 2

您还可以查看可以连接到各种数据库的PHP可编辑数据网格，并支持Mathjax作为渲染器。

编辑：http://prntscr.com/g8gu9g 结果：http://prntscr.com/g8gu24

代码：https://gist.github.com/gridphp/d845df051ff7d7086f3cf947f3da44d5