6

我发现当我将Prism.js语法高亮与Turbolinks高亮结合使用时，会出现奇怪的行为。

当我第一次加载应该突出显示语法的页面时，不会触发 Prism.js 并且没有突出显示任何内容。重新加载同一页面后，Prism 将启动并突出显示代码。此后页面将保持突出显示，除非我更改位置（转到根目录）并返回到它（在同一场景之后）

当我从清单文件（application.js）中删除 Turbolinks 时，一切正常（当然 Turbolinks 没有做任何事情）

我不想用

= link_to "Foo", blogs_path(blog), "data-no-turbolink" => true

因为我必须在每个链接上使用它（每个博客都会突出显示一些代码），因此根本没有 turbolinks

我试图使用Turbolings 事件，page:change但我对纯 JavaScript 很糟糕（Prism.js 是纯 JS，我是 jQuery junky）

所以有人知道如何告诉 Turbolinks 触发 Prism.js 语法高亮吗？

4

1 回答 1

16

我最近遇到了同样的问题，我发现的解决方法是在页面加载后重新运行 Prism。我使用 Turbolinks page:load 事件来触发它。

在咖啡脚本中：

$(document).on 'ready page:load', ->
    Prism.highlightAll()

或者在普通的 JS 中：

$(document).on('ready page:load', function() {
    Prism.highlightAll();
});
于 2014-01-25T19:41:35.973 回答