Question

我正在使用MathJax在我的网页上显示Math。这是我加载和配置它的方式：

<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    extensions: ["tex2jax.js"],
    jax: ["input/TeX", "output/HTML-CSS"],
    tex2jax: {
      inlineMath: [ ['$','$'], ["\\(","\\)"] ],
      displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
      processEscapes: true
    },
    "HTML-CSS": { fonts: ["TeX"], linebreaks: { automatic: true } }
  });
</script>
<script src="//mathjax.rstudio.com/latest/MathJax.js?config=TeX-MML-AM_CHTML"></script>

该脚本被放置为<body>中的最后一个条目。在此之前，我有一些（长）数学方程式：

<body>
$$
    a + b + c + d + \int_a^b f(x)dx - \sum_k c_k\int g(x)dx = \prod_n \int_{\Omega_k} F(x,y,z) d\omega
$$ 
...

问题

当我加载页面时，它使方程很好。但是，当我将页面大小设置得很窄并刷新/加载页面时；等式的显示方式不适合页面。

MathJax doc指出linebreaks: { automatic: true }可用于自动中断长表达式。为什么这行不通？

实时演示：我已经发布了CodePen demo。

问题排查

我也发现了类似的问题，例如this question。那里的CodePen有效，我不明白为什么我的代码不起作用。

Answer 1

问题源于您的内联配置与MathJax（通过查询字符串）一起加载的组合配置文件不一致。

内联，您正在为HTML-CSS输出设置自动换行符。但是，组合的配置文件将加载CommonHTML输出。

对配置的最后一次更新来自组合的配置文件，因此最终得到CommonHTML输出（可以通过MathJax上下文菜单进行检查，还可以在那里切换到HTML-CSS －注意：这将设置一个cookie ）。

因此，您可以更新串联配置或切换组合配置。

我建议使用CommonHTML输出，该输出比现在肯定古老的HTML-CSS输出（在IE8新时设计的）更新和更快。如果您知道将要呈现的内容，也可以在查询字符串中添加-full以获取更大的有效负载（否则MathJax首先在加载更多组件之前先寻找内容）。

body { width: 10em}

<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    extensions: ["tex2jax.js"],
    tex2jax: {
      inlineMath: [ ['$','$'], ["\\(","\\)"] ],
      displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
      processEscapes: true
    },
    "CommonHTML": { linebreaks: { automatic: true } }
  });
</script>
<script src="//mathjax.rstudio.com/latest/MathJax.js?config=TeX-MML-AM_CHTML"></script>

$$
    a + b + c + d + \int_a^b f(x)dx - \sum_k c_k\int g(x)dx = \prod_n \int_{\Omega_k} F(x,y,z) d\omega
$$

MathJax自动换行不起作用

问题

问题排查

1 个答案: