Rails + 基础：加载顺序并将自定义 javascript 添加到基础元素答案

【问题标题】：Rails + foundation : load order and adding custom javascript to foundation elementsRails + 基础：加载顺序并将自定义 javascript 添加到基础元素
【发布时间】：2015-05-28 03:59:22
【问题描述】：

序言：这不是另一个 turbolinks 问题 :) 我实际上已经从我的 Gemfile 和 application.js 中删除了 turbolinks。

所以我正在运行一个 Rails 4.2.0 应用程序。我正在使用基础导轨 gem 和 jquery-rails。按照建议，我在 application.js

中初始化了基础细节

$(function(){
  $(document).foundation();
});

在我的控制器javascript（实际上是coffeescript）中，我有以下绑定到基础显示事件（在我的模式上具有自定义行为）

$( () ->
    bindReveal()        
)

bindReveal = () ->
    $(document).on('open.fndtn.reveal', '#modal-thanks', (event) ->
        if 'fndtn.reveal' == event.namespace
            modal = $(this)
            modalTimeout = window.setTimeout( () ->
                modal.foundation('reveal', 'close')
            , 1500)
    )

    $(document).on('closed.fndtn.reveal', '#modal-thanks', (event) ->
        if 'fndtn.reveal' == event.namespace
            window.clearTimeout(modalTimeout)
            modalTimeout = 0
            goToNextQuestion()
    )

如果我这样做，实际上它不起作用。模态确实出现了，但事件未绑定。

我实际上是通过 sprockets 指令追踪到的一个事实

//= require_tree .

在 application.js 中，控制器 js 代码实际上在 application.js 主体代码之前执行，其中包含基础 init 调用。所以当我尝试绑定我的基础事件时，基础实际上并没有启动。

我有一个解决方案，见下文，但它并不是 100% 让我满意。

所以我的问题是：我错过了什么吗？使用基础导轨的最佳做法是什么？

谢谢

【问题讨论】：

标签： jquery ruby-on-rails-4 zurb-foundation

【解决方案1】：

我最终做的是在基础初始化后发出我自己的自定义事件并在那里绑定我的事件

应用程序.js：

//= require_tree .

$(function(){
  $(document).foundation();
  $(document).trigger("done.speedyrating.foundation");
});

controller.coffee 脚本：

$( () ->
    setupPostFoundation()        
)

setupPostFoundation = () ->
    $(document).on("done.speedyrating.foundation", () ->
        setupDropdownMenu()
        setupModalThanks()
    )

虽然这很好用，但我觉得我一定错过了一些东西。不可能有这样的“洞”并且没有记录在案。很多人一定会遇到同样的问题，尽管我的研究并没有给我带来任何好处。

【讨论】：