javascript - 如何将 Mathjax 支持添加到 PHPMyAdmin

Question

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

如果你想要一个例子，这里是我们想要输入数据库的那种东西:

In first year calculus, we define intervals such as $(u, v)$ and $(u, \infty)$. Such an interval is a \emph{neighborhood} of $a$ if $a$ is in the interval. Students should realize that $\infty$ is only a symbol, not a number. This is important since we soon introduce concepts such as $\lim_{x \to \infty} f(x)$.

When we introduce the derivative [ \lim_{x \to a} \frac{f(x) - f(a)}{x - a}, ] we assume that the function is defined and continuous in a neighborhood of $a$.

Answer 1

我找到了一个解决方案。您可以使用 this link 下载修改后的 PHPMyAdmin 发行版(它不会永远可用)。我将描述我所做的更改。如果需要，您可以自己重复。

它是这样的:

当您创建新条目或编辑现有条目时，该脚本将在“插入”选项卡上运行。该脚本适用于所有文本区域(多行编辑字段)。在您更改文本区域中的某些内容并将焦点移出它(通过四处单击)后，文本 block 将创建在此文本区域上方。 Textarea 的内容复制到这个 block 中。如果有一些公式，它们将由 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 .

打开tbl_change.php PHPMyAdmin 根目录中的文件并找到此部分:

$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';