问题标签 [turbolinks-5]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
ruby-on-rails - Rails 样式在页面之间持续存在
我正在创建一个读书应用程序。每本书has_many页。通过单击页面的左半部分和右半部分，我有从一页到下一页的链接。当您将鼠标悬停在页面边缘时，浮动在页面上的 div（充当链接）会更改其不透明度，以指示存在另一个页面。这些 div 是img-prev和img-next
这是页面右半部分的悬停效果示例：
问题是，在单击下一个（或上一个）页面后，该新页面的后续img-prev或img-nextdiv的不透明度在变回完全透明之前非常短暂地仍然是其“深色”颜色。我感觉这与 turbolinks 有关，但我不确定。
应用程序/视图/页面/show.html.erb
应用程序/资产/样式表/pages.scss
应用程序/资产/javascripts/pages.js
我唯一的线索是，如果我强制我的img-prev和img-next链接忽略 turbolinks，问题就会消失，但是在每个不太理想的页面上都会进行整页刷新。代码如下所示：
app/views/pages/show.html.erb（替代）
不确定它是否相关，但我应该提到我已将这一行添加到我的config/initializers/assets.rb：
另外，这个应用程序的完整源代码可以在我的 Github 上找到： https ://github.com/tliss/lianhuanhua
javascript - 我第一次在页面上导航时不会调用头部中的特定页面脚本。代码组织质疑
我第一次使用 Turbolinks 而不是 Rails（我使用的是 Django）。
再生产
https://glitch.com/edit/#!/join/dc628a17-3ccd-47b4-9921-8fb332aaebb1
源代码
/li>index.html：
/li>about.html：
/li>index.js：
/li>about.js：
问题
如果我从页面开始/index，然后通过链接导航到/about没有任何反应！
如果我现在回到/index我可以在控制台中看到日志：I will drawChart() here。所以听众正在工作。
如果我从它开始（刷新），/about它会在控制台中打印消息，以便侦听turbolinks:load器在刷新时运行该函数drawChart()。
我期待什么，我做了什么
drawChart()我也需要在第一次导航中调用该函数/about。
所以我想在文件中使用直接调用（drawChart()如您所见，在源代码中对此问题进行了评论）并且它有效。
但我认为这不是好方法，特别是因为如果我继续/about刷新页面，它会被调用两次！
在我看来这太hacky了。
不是吗？
其他人做什么
- 同样的问题，但他的解决方案对我不起作用：https ://candland.net/rails/2019/03/13/rails-turbolinks-not-firing-js-on-load.html
感谢您的工作！
turbolinks - 对特定页面仅使用一次 turbolinks:load 事件？
我有一些代码只想在我的应用程序的一页上运行，所以在我的 HTML 中，我使用了以下内联 JS：
<script>
$(document).on('turbolinks:load', function() {
console.log("Ground control to major tom?")
});
</script>
但是，当用户离开该页面时 - 该代码仍在每次后续访问时运行。
如何仅对特定页面使用 turbolinks:load 事件？
我是否需要以某种方式“拆除”该事件处理程序？我将如何防止它影响我可能拥有的任何其他 turbolinks:load 事件？
javascript - 自定义 javascript 函数在带有 Turbolinks 的 Rails 5 中不起作用
我是 javascript 新手，在获取自定义函数以在 Rails 5 应用程序中工作时遇到问题。我正在尝试添加一个在引导导航栏标题中设置活动链接的简单函数。我让所有东西都可以在 codepen 中工作，但是当我将它添加到我的 Rails 应用程序时，它无法正常工作。我知道 javascript 正在运行，因为我正在使用引导程序并且这些功能可以正常工作。我还认为脚本是通过检查 Chrome 开发人员工具中的源来加载的，并且它就在那里。但是，设置断点永远不会被触发。
我已经阅读了大约 30 个类似的问题，但没有一个能帮助解决我的问题，所以我真的希望有人能让我克服这个障碍。
这是我写的代码：
HTML
Javascript
Application.js 文件（我的代码在 app/assets/javascripts 中的 custom.js 中）
这是代码笔，显示它在该环境中工作以及我正在尝试完成的工作。
更新 所以，我最初的问题是由于 turbolinks，代码没有在 DOM 之后加载。我添加了以下代码，现在它正在运行。
但是，代码没有像在我的 codepen 中那样运行。活动链接未按预期更改。无论单击的链接如何，最初标记为活动的链接都将保持活动状态。我缺少的页面是否还有其他加载问题？
jquery - turbolinks:load 事件在本地机器上工作而不是在 Heroku 上
我正在使用带有 Rails 6 的 Webpacker。 turbolinks:load 事件在本地正常工作，但在部署到 Heroku 时不能正常工作。我$(document)on.('turbolinks:load' ()=>{})通过将“ready.js”文件导入我的应用程序文件夹来使用标准 jquery。在事件处理程序中添加控制台日志适用于我的计算机，但不适用于已部署的应用程序。
我将代码粘贴到我的 application.js，packs 文件夹中的文件。application.html.erb 形成 layouts 文件夹和 ready.js 文件。我对为什么这不起作用的想法为零。我已经搞砸了大约一个星期，但没有成功。我已经尝试在 application.js 文件中使用 turbolinks:load 事件侦听器。我也刚刚尝试做一个简单的 console.log 没有其他代码，以确保没有其他代码可能会阻止代码。即使是最简单的情况仍然无法正常工作。我还从位于 cloudflare 后面的站点中清除了缓存，并从 Heroku 中清除了构建缓存。
我真的很感激任何帮助。如果我一直遇到我不想做的问题，我的下一步就是不使用 turbolinks。
应用程序.html.erb：
应用程序.js：
准备好了.js
php - Laravel 表单提交不起作用（Livewire + Turbolinks）
我的项目需要 livewire 包，但以前没有使用过。一些 livewire 组件在不刷新页面的情况下无法工作，我不明白这是为什么。
注意：我使用 Turbolinks (SPA)。在不刷新浏览器的情况下切换页面。
当我禁用 Turbolinks 时，表单提交工作，但是当 Turbolinks 处于活动状态时，在页面之间切换时会加载 livewire 组件，但操作不起作用。
Laravel 8.12 / Livewire 2.3 / Turbolinks 5.2
jquery - 为什么 $.ajax 函数被调用两次作为页内脚本？
应用程序/控制器/dashboards_controller.rb
应用程序/视图/仪表板/admin.html.slim
应用程序/视图/仪表板/admin.js.erb
信息：这些部分是在标签内的“admin.html.slim”上进行的 ajax 请求上加载的。
（对于 turbolink/non-turbolink 访问 admin.html.slim）当 admin.html.slim 被加载时，$.ajax 方法被调用了两次，它直接在标签内。为什么它被调用两次？
谢谢你。
javascript - ajaxStart/turbolinks:click 在使用远程点击链接时不会触发：true
尝试在单击具有远程 true 的链接时显示微调器，使用 turbolinks:events 和 ajaxStart/ajaxStop 事件尝试两种方式。turboinks:load 事件已成功触发，但 :click 没有。ajaxStart 和 ajaxStop 都不起作用。
使用 rails 6、turbolinks 5、webpacker。链接正在以非常正常的方式生成示例：
此代码位于<head> </head>application.html.erb中
使用 ajaxStart/ajaxStop 的代码也可以放在 application.html.erb 中
编辑
将事件处理更改为以下内容：
此代码在 ajax:starts 时显示（）.sk-cube-grid，但在 :complete 或 :success 时不隐藏。