Rails3 Sprockets JS 连接：避免 JS 冲突的最佳实践答案

【问题标题】：Rails3 Sprockets JS concatenation: Best practice to avoid JS conflictsRails3 Sprockets JS 连接：避免 JS 冲突的最佳实践
【发布时间】：2012-04-15 17:44:22
【问题描述】：

假设有两个页面具有两个具有相同名称的不同 html 元素

a.html
<select id='collection_select'></select>


b.html
<select id='collection_select'></select>

还有一个javascript函数只能应用于a.html

a.js
$(function(){
  $('#collection_select').change(function(){
    ....
  })
})

因为 Rails 连接了所有的 JS 资产，这个函数现在也适用于b.html。是否有 Rails/Sprockets/JS 最佳实践以特定方式构造和命名 JS 资产，以便 JS 的范围仅限于特定页面。

【问题讨论】：

我认为这是一个很好的问题（我最近问了一个类似的问题），但我不禁说最好的做法是为您的选择提供更好的 id。 ;)

标签： html ruby-on-rails-3.1 sprockets

【解决方案1】：

这篇博文提供了一个很好的方法：http://viget.com/inspire/extending-paul-irishs-comprehensive-dom-ready-execution

总结起来就是

将data-controller 属性放在<body> 标记上。
为命名空间中的所有 JS 设置范围。
JS Util 然后按照约定在data-controller 的JS 命名空间中匹配并加载JS。

干杯

【讨论】：

【解决方案2】：

JsSpace.on('users', {
  index: function(){
    console.log('index action of users controller');
  }
});

该模式由渲染控制器实现，然后将动作放入 body 属性中获取它们并执行匹配功能。 js-namespace-rails

【讨论】：