定义新宏以添加“title”属性答案

【问题标题】：define new macro to add "title" attribute定义新宏以添加“title”属性
【发布时间】：2013-07-27 00:20:10
【问题描述】：

我在我的网站上使用 MathJax，我想添加一些语义支持。

目前，我的 MathJax 配置是接受 TeX 输入并输出 HTML-CSS 输出（不幸的是，MathML 在 Chrome 中不能很好地工作）。我还有一个 jQuery 函数，它获取任何 .latex 类的 html 并将其转储到 title 属性中。

以下 HTML...

<div class="latex">\[ a^2 + b^2 = c^2 \]</div>

使用以下脚本...

/* jQuery */
$('.latex').attr('title', function() {
    return $(this).html();
})

将输出...

<div class="latex" title="\[ a^2 + b^2 = c^2 \]">
    <div class="MathJax_Display">a2+b2=c2</div> <!-- becomes prettyprint in browser -->
</div>

显然div.MathJax_Display 的内容将使用一系列跨度、类和样式来设置样式。我只是不打算在这里输入所有内容。无论如何，在渲染数学之后，用户可以将鼠标悬停在div.latex 上以查看工具提示中的 TeX 命令。

现在，我想做的是在我的 MJ 配置中定义一个新宏，它会在给定一些 TeX 输入的情况下将title 属性添加到新创建的 HTML-CSS 输出范围。我们称该宏为\title[2]。这是我希望能够输入的内容：

<div class="latex">\[ a^2 + b^2 = \title{c}{'hypotenuse'}^2 \]</div>

这是我希望它输出的内容：

<div class="latex" title="\[ a^2 + b^2 = \title{c}{'hypotenuse'}^2 \]">
    <div class="MathJax_Display">a2+b2=<span title="hypotenuse">c</span>2</div> <!-- prettyprint -->
</div>

如果发生这种情况，将鼠标悬停在数学中的 c 上的用户将获得一个显示“斜边”的工具提示，但将鼠标悬停在数学的任何其他区域上并获得原始输入。

这是我对算法的想法：

//伪代码：
给定 TeX 输入 '\title{mathstr}{titlestr}'：
  var thespan = document.createElement('span');
  $(thespan).attr('title', titlestr).html(mathstr);
  以某种方式将其放入正确位置的 MJ 输出中

【问题讨论】：

标签： math-mode macros html mathjax

【解决方案1】：

为什么不直接使用定义\texttip 和\mathtip 的action 扩展来将工具提示附加到子表达式？有关详细信息，请参阅MathJax documentation。

【讨论】：

这个宏的缺点是它是用 JavaScript 编写的，而不是 HTML，所以 (1) 禁用 JS 的用户（并且仍然能够看到原始的 TeX 输入）将无法请参阅工具提示，以及 (2) 嵌套的 \mathtip 命令导致 UNDERlapping，而不是重叠。也就是说，JS 会显示最外层 span 的 tooltip。另一方面，HTML title 属性将重叠，这意味着最里面的元素的工具提示被显示。我接受了你的回答，因为它是正确的，但它并没有解决我的问题:(
我刚刚想通了...使用\mathtip 使用JS 来创建看起来像工具提示的框，因此嵌套它们是没有意义的。但\texttip 实际上在 HTML 中创建了title 属性，因此它们的作用类似于正常的工具提示，它们确实重叠。即使使用 \( 和 \) 分隔符，您也不能在其中添加任何数学运算，否则它们将变成冒名顶替的工具提示。
嵌套的\mathtip 调用对我来说很好用。您使用的是什么浏览器/操作系统？
您对\texttip 和\mathtip 之间的区别是正确的。这是因为 HTML 工具提示的内容只能是文本，不能是 HTML，而且由于数学需要 HTML 布局，因此不能使用 HTML 工具提示。所以 MathJax 必须为数学内容实现自己的工具提示。
我不明白您关于为此使用 javascript 的投诉 (1)。如果关闭 javascript，您原来的 <div class="latex">\[ a^2 + b^2 = \title{c}{'hypotenuse'}^2 \]</div> 也不会显示工具提示。唯一不同的是宏的名称。也许我误解了你的抱怨。