使用wiselink在模板中嵌入javascript

Question

我在Rails應用程序中使用了Wiselinks，但是當我添加更多視圖模板時，要使這些模板中的JavaScript在需要的時候運行會遇到麻煩。

天真的，我想做的是這樣的：

模板

....
- content_for :subscript do
    :javascript
        $(function() {
            // do stuff
        }

content_for :subscript將js放在文檔的底部，因此對於常規的HTTP請求，它可以快速加載。

$(function() { ... }是要等到DOM加載后再執行內部js。

不幸的是，這不起作用有兩個原因：

1. wiselinks請求將忽略content_for行，因為它沒有呈現到布局中，而只是呈現了模板。

2. $(function() { ... }位將僅在觸發jQuery ready事件時得到評估，而在wiselinks請求中不會觸發。

我可以通過定義一個輔助方法wise_content_for來解決第一個問題，該方法的工作方式類似於content_for，只是它會返回其內容以直接在wiselinks請求上呈現在頁面上。 現在，我可以執行以下操作：

= wise_content_for :subscript do
    ...

我可以通過觸發page:always在第一次DOM加載時解決第二個問題，然后在其中包裝我的js代碼：

布局

...
:javascript
    $(function() {
        wiselinks = new Wiselinks($('#wiselinks-container'));
        $(document).trigger('page:always')
    }
...

模板

= wise_content_for :subscript do
    :javascript
        $(document).on('page:always', function() {
            // do stuff
        }

但是... // do stuff執行之后，現在將在每個wiselinks請求上執行操作。 這對於某些代碼而言是不可取的，因此我正在尋找一種方法來確保僅在呈現該模板時才執行每個模板的js代碼。

任何人都知道如何執行此操作？

我正在尋找一種解決方案，該解決方案將允許使用此代碼的其他開發人員不必擔心每個模板在正常呈現時與使用wiselink時的工作方式。

Answer 1

這是我想出的：

我只在第一個頁面加載之后以及每個wiselinks請求完成之后調用在數組Boundless.PageCallbacks定義的每個函數。 在每個wiselinks請求的開始都會清除該數組，因此每次僅執行在當前請求期間推送到該數組的代碼。

布局

:javascript

  function call_page_callbacks(){
    _.each(Boundless.PageCallbacks, function(callback){ callback(); }
  }

  $(function() {
    new Wiselinks($('#wiselinks-container'));

    $(document).off('page:loading').on('page:loading', function(){
      Boundless.PageCallbacks = [];
    });

    $(document).off('page:always').on('page:always', call_page_callbacks);

    call_page_callbacks();
  }

模板和部分

= wise_content_for :javascripts do

  :javascript

    Boundless.PageCallbacks.push(function() {
      // do stuff
    });

application_helper.rb

def wise_content_for(name, content = nil, options = {}, &block)
  if request.wiselinks?
    if block_given?
      options = content if content
      content = capture(&block)
    end
    content
  else
    content_for name, content, options, &block
  end
end