javascript - 如何向 PHPMyAdmin 添加 Mathjax 支持

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 。在PHPMyAdmin目录下创建名为js/mathjax/distrib的文件夹并将 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';