Ruby on Rails：仅在启用了Turbolink的已定义页面中呈现javascript

Question

我已经将JavaScript嵌入到使用Turbolinks的Rails视图中，例如：

ViewX.html.haml：

.blah
  Blah

:javascript
 $(function() {
   $(".blah").offset().top;
 });

加载ViewX时，一切正常。 但是，当我导航到“查看YI”时，在控制台中出现以下错误：

Uncaught TypeError: Cannot read property 'top' of undefined

当我导航到其他视图时，该错误仍然存​​在。 进行硬刷新时，它消失了，但是下次我渲染ViewX时返回。

我的问题是我如何只为特定视图呈现一些JS代码片段，而不污染应用程序的其余部分？

编辑

好的，我想出了一种方法，某种程度上是一种破解，但是却是一种内含的破解。 将ViewX.html.haml更改为：

ViewX.html.haml：

.blah
  Blah

%script{:type => "text/javascript", 'data-turbolinks-eval' => 'false'}
 :plain
   $(function() {
     $(".blah").offset().top;
   });

Answer 1

一种简单的方法是使每个视图的body标签具有不同的css类：

var bodyClass = $('body').attr('class');

switch(bodyClass) {
    case 'home-page':
    // do stuff
    break;

    case 'about-page':
    // do stuff
    break;
}

如果每个页面都有很多代码，则可以使用模块模式并将每个模块设置为单独的.js文件。

case 'home-page'
  MyModule.initialize(); // set up form validation or whatever you need
break;

另一个选择（如果您不能将CSS类添加到body标签）是使用隐藏的<input>标签，该标签保存视图的名称并使用该名称进行切换。

var switchJS = $('input[type=hidden]').attr('data-view');
/* i.e. <input type="hidden" data-view="my-home-page" /> */
switch(switchJS) { ...