Javascript 使用MathJax时截断时的奇怪行为

我已经为一个网站实现了MathJax，我正在尝试实现的是将文本区域缩短到一定的长度，并使其可点击，然后在点击时加载更多内容。MathJax可以很好地加载截断的文本，但是当我单击文本将其展开到整个段落时，MathJax会将初始的缩短数学附加到新渲染的整个段落的末尾。有没有人有这方面的经验？我假设它发生是因为被截断的文本仍然在队列中，因此在加载整个文本后它仍然会打印它，但我似乎不知道如何从队列中清除队列缩短的文本以使其正常工作。如有任何帮助/建议，将不胜感激

以下是我的基本代码：

var showOnClick = function() {
        ctrl.showAll(!ctrl.showAll());
};

MathJax.Hub.Queue(['Typeset', MathJax.Hub]);
return m('p.readable.pointer', {onclick: showOnClick},
          ctrl.showAll() ? result.description : description_truncated);

---

我认为主要原因是您已经拥有了所有包含公式部分的跨距，当您添加文本时，引擎会尝试将文本字段的所有内容作为源并重新格式化。因为跨距看起来不像数学源，所以它会丢弃它们（这只是一个猜测，但看起来它是这样工作的）

我的解决方案是：不直接添加一些文本，而是添加一个新的范围，并仅在此范围内重新生成公式。小心：如果要添加的文本是这样剪切的，它将不起作用：[“我的超级公式：$x\subset”，“\mathbb{R}$。”]

下面是我的简化示例（请注意，我用id“txt2”刷新了span）：

MathJax.Hub.Config（{tex2jax:{inlineMath:[['$'，'$']，['\\（'，'\\）']}）；
函数addText（）{
document.getElementById（'txt'）.innerHTML+='…添加新公式：$x\\subsetq x$'；
Queue（[“Typeset”，MathJax.Hub，“txt2”]）；
}
$1\neq 0$

我认为主要原因是您已经拥有了所有包含公式部分的跨距，当您添加文本时，引擎会尝试将文本字段的所有内容作为源并重新格式化。因为跨距看起来不像数学源，所以它会丢弃它们（这只是一个猜测，但看起来它是这样工作的）

我的解决方案是：不直接添加一些文本，而是添加一个新的范围，并仅在此范围内重新生成公式。小心：如果要添加的文本是这样剪切的，它将不起作用：[“我的超级公式：$x\subset”，“\mathbb{R}$。”]

下面是我的简化示例（请注意，我用id“txt2”刷新了span）：

MathJax.Hub.Config（{tex2jax:{inlineMath:[['$'，'$']，['\\（'，'\\）']}）；
函数addText（）{
document.getElementById（'txt'）.innerHTML+='…添加新公式：$x\\subsetq x$'；
Queue（[“Typeset”，MathJax.Hub，“txt2”]）；
}
$1\neq 0$

你原来的帖子没有显示你是如何在段落中添加额外文本的，但是如果它在你的答案中使用了

innerHTML+=…

，那么这可能是你重复计算的原因。通过这样做，您将删除当前DOM，并将其替换为新的DOM，该DOM是从旧DOM复制而来的，但与旧DOM不同。特别是，您丢失了MathJax与记录已处理内容的旧DOM一起存储的值，因此，当您要求MathJax重新排版页面时，看起来所有的数学都是新的，因此再次排版，在文档中引入了排版数学的第二个副本

虽然当前版本确实避免了复制，但它仍然丢失了从复制的DOM到MathJax的所有连接。例如，上下文菜单将不再适用于旧的数学表达式，因为处理未通过设置

innerHTML

复制的表达式的代码。所以这不是一个好的方法

相反，你可以试试

document.getElementById('txt')
        .appendChild(document.createTextNode('...adding new formula: $x\\subseteq X$'));

---

它不会改变现有的DOM，只需添加一个新的文本节点。然后你可以重新排版页面，而不会出现重复。

你的原始帖子没有显示你是如何向段落中添加额外文本的，但是如果它在你的答案中使用了

innerHTML+=…

，那么这可能就是你重复计算的原因。通过这样做，您将删除当前DOM，并将其替换为新的DOM，该DOM是从旧DOM复制而来的，但与旧DOM不同。特别是，您丢失了MathJax与记录已处理内容的旧DOM一起存储的值，因此，当您要求MathJax重新排版页面时，看起来所有的数学都是新的，因此再次排版，在文档中引入了排版数学的第二个副本

虽然当前版本确实避免了复制，但它仍然丢失了从复制的DOM到MathJax的所有连接。例如，上下文菜单将不再适用于旧的数学表达式，因为处理未通过设置

innerHTML

复制的表达式的代码。所以这不是一个好的方法

相反，你可以试试

document.getElementById('txt')
        .appendChild(document.createTextNode('...adding new formula: $x\\subseteq X$'));

---

它不会改变现有的DOM，只需添加一个新的文本节点。然后您可以重新排版页面，而不会出现重复。

我想文本区域不是MathJax的一部分。。。是你自己写的onclick机制吗？你能在你的问题中发布一个代码示例吗？当然，刚刚更新了@IgorSorry，我不熟悉你控制器中的showAll函数，所以我根据你的描述回答了这个问题。@Igor很好，谢谢！我正在尝试将您的代码应用于我的情况。看起来它正是我需要的。我想文本区域不是MathJax的一部分。。。是你自己写的onclick机制吗？你能在你的问题中发布一个代码示例吗？当然，刚刚更新了@IgorSorry，我不熟悉你控制器中的showAll函数，所以我根据你的描述回答了这个问题。@Igor很好，谢谢！我正在尝试将您的代码应用于我的情况。看起来这正是我所需要的