logo标签列表

Rails 5 点击链接后出现空白页面

javascriptruby-on-railsruby-on-rails-5turbolinks
5

我正在尝试在我的网站上安装Comodo的TrustLogo...所以，我在部分中有以下内容：

<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
<script type="text/javascript"> //<![CDATA[ 
      var tlJsHost = ((window.location.protocol == "https:") ? "https://secure.comodo.com/" : "http://www.trustlogo.com/");
      document.write(unescape("%3Cscript src='" + tlJsHost + "trustlogo/javascript/trustlogo.js' type='text/javascript'%3E%3C/script%3E"));
      //]]>
</script>

这样做的问题在于，当我访问页面 http://localhost:3000 时，主页可以正常加载；
但是，如果我尝试单击任何链接，则页面不会加载；
按下 F5 或刷新按钮后，它可以正常加载。
所以我尝试这样做：
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'https://secure.comodo.com/trustlogo/javascript/trustlogo.js', 'data-turbolinks-track': 'reload' %>

但是这会引起相同的问题。

我尝试更改位置，所以我去到 application.js 并添加了以下内容：

document.addEventListener("turbolinks:load", function(){
  var tlJsHost = ((window.location.protocol == "https:") ? "https://secure.comodo.com/" : "http://www.trustlogo.com/");
  document.write(unescape("%3Cscript src='" + tlJsHost + "trustlogo/javascript/trustlogo.js' type='text/javascript'%3E%3C/script%3E"));
});

但这给我带来了以下HTML结果（空白页面）
<html>
<head>
<script src="http://www.trustlogo.com/trustlogo/javascript/trustlogo.js" type="text/javascript"></script>
<style type="text/css" media="screen">#comodoTL {display:block;font-size:8px;padding-left:18px;}</style>
</head>
</html>

有什么想法吗？

更新：

根据@patkoperwas的建议将代码移到<head>之外，但页面仍然是空白的，并在控制台中出现以下错误：

turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6 未捕获的类型错误：无法读取空值的querySelector属性 在n.t.SnapshotRenderer.n.findFirstAutofocusableElement (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)中 在n.t.SnapshotRenderer.n.focusFirstAutofocusableElement (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)中 在turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6中 在n.t.Renderer.t.renderView (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)中 在n.t.SnapshotRenderer.n.render (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)中 在Function.t.Renderer.t.render (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)中 在e.t.View.e.renderSnapshot (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)中 在e.t.View.e.render (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)中 在r.t.Controller.r.render (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)中 在r. (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)中
你的服务器日志记录了什么？ - Daniel Westendorf
日志上没有异常：Completed 200 OK in 50ms (Views: 45.6ms | ActiveRecord: 0.9ms)。 - WeezHard
1个回答
0

尝试移动脚本

<script type="text/javascript"> //<![CDATA[ 
      var tlJsHost = ((window.location.protocol == "https:") ? "https://secure.comodo.com/" : "http://www.trustlogo.com/");
      document.write(unescape("%3Cscript src='" + tlJsHost + "trustlogo/javascript/trustlogo.js' type='text/javascript'%3E%3C/script%3E"));
      //]]>
</script>

将代码放入<body>而不是<head>中。根据Turbolinks文档：

Turbolinks在每次呈现页面时评估页面<body>中的<script>元素。您可以使用内联正文脚本设置每个页面的JavaScript状态或引导客户端模型。

发生的情况是该脚本在页面加载和刷新时第一次运行和评估。在页面更改时，脚本不会重新运行（因为它在<head>中），因此不会发生任何事情。

嗨@patkoperwas，请检查我的更新。在浏览器控制台中仍然收到相同的空白页面和错误。 - WeezHard
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接