Rails - 引导弹出框 js

Question

我试图了解 js 在 Rails 中的工作原理。

我正在使用引导程序，并设法让弹出框工作，但不是以我理解的 Rails 工作方式。

我目前在我的组织视图文件夹中有一个名为 _preferences 的部分。在我的组织展示页面中，我呈现了部分内容。部分有一个调用弹出框的按钮，如：

 <button class="fa fa-info-circle fa-2x fa-border btn-info" id="publicity" href="#"  rel="popover" data-original-title="Publicity Issues" data-content="<%= publicity_popover(@organisation.preference)%>"></button>

我尝试制作一个包含以下内容的 organizations.js 文件：

$('#publicity').popover()
$('#academic_publication').popover()
$('#presentations').popover()

但是当我尝试这种方法时，弹出框不起作用。

当我将以下内容添加到首选项部分的底部时，一切正常。

<script>
$('#publicity').popover()
$('#academic_publication').popover()
$('#presentations').popover()
</script>

我预计第一次尝试会奏效。我不明白为什么它没有。有人看到错误吗？

Answer 1

您没有这样使用 turbolinks。您创建的文件正在被获取到文档 <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 的头部，这是一种不好的做法，如果您要正确使用 turbolinks 那么你的应用程序会更快。在 application.js 添加：

ready = function(){
$('#publicity').popover();
$('#academic_publication').popover();
$('#presentations').popover();
};
$(document).ready(ready);
$(document).on('page:load', ready);

阅读更多https://github.com/turbolinks/turbolinks-classic