Javascript 为什么所有coffeescript文件总是同时执行

Javascript 为什么所有coffeescript文件总是同时执行,javascript,ruby-on-rails,ruby,coffeescript,Javascript,Ruby On Rails,Ruby,Coffeescript,在assets文件夹中,每个型号都有不同的coffeescript文件。但每次我访问一个页面时,它们都会被执行,即使它来自不同的控制器。如果我继续/insertion/new,我希望只执行insertion.coffee,而不是执行所有的.coffee。如何一次启动一个 这是我的插入物。咖啡 $(document).on "turbolinks:load", -> if ($('#insertion_book_search')) console.log("found") c

在assets文件夹中,每个型号都有不同的coffeescript文件。但每次我访问一个页面时,它们都会被执行,即使它来自不同的控制器。如果我继续/insertion/new,我希望只执行insertion.coffee,而不是执行所有的.coffee。如何一次启动一个

这是我的插入物。咖啡

$(document).on "turbolinks:load", ->
  if ($('#insertion_book_search'))
    console.log("found")
  console.log($('#insertion_book_search').length)
  console.log($('#insertion_book_title').length)
  $('#insertion_books_subject').parent().hide()
那是我的咖啡

$(document).on "turbolinks:load", ->
  console.log("Mie cose")
  $('.last_img').on 'load', ->
    natHeight = $(this).get(0).naturalHeight
    natWidth = $(this).get(0).naturalWidth
    if (natWidth > natHeight)
      $(this).css( 'width','100%')
    else
      $(this).css( 'height','100%')
我想实现的是,当我使用插入控制器时,它只加载insertion.coffee,而当我使用静态页面控制器时,它只加载static_pages.coffee。 据我所知,当我在
/app/assets/javascript/application.js
中添加行
//require\u tree.
时,我的所有咖啡都会加载到我的所有视图中


如果我删除require树并尝试添加它们,我需要一个.js文件,而不是一杯咖啡。是否可以加载coffee文件?

您应该阅读更多关于Rails的信息。正在执行所有脚本,因为在
application.js
manifest文件中很可能有
/=require\u tree.

如果要手动指定操作的JS文件,应该重新组织清单(至少从清单中删除
/=require\u tree.
),然后可以使用
javascript\u include\u标记来手动包含JS。更多信息

注意:如果您手动包含文件,而不在清单中提及它们,您还应该将
Rails.application.config.assets.precompile+=%w(path/to/file)
添加到
config/initializer/assets.rb
中以使其预编译。否则,您将得到一个异常,它将告诉您这样做。更多

如果我删除require树并尝试添加它们,我需要一个.js文件,而不是一杯咖啡。可以加载咖啡文件吗


无论如何,您的coffeescript文件将被预编译为JS。您只需指定不带扩展名的文件名。

您可以使用coffeescript OOP方法进行选择,下面是详细信息和一些符合您要求的代码

  • 我建议您使用coffee-with-class方法,然后使用事件turbolinks:load检查每个页面
  • 您可以检查名称为的页面 控制器和方法,例如$(“.purchase\u requests.new”)[0],表示控制器是purchase\u requests,方法是new
  • 另外,我建议你阅读brandon hilkert的博客,以获得更多参考
带有检查每个页面加载的示例coffeescript

class App.PurchaseRequest

  renderYourJavascript: ->
    console.log "purchase request js"

$(document).on "turbolinks:load", ->
  if $(".purchase_requests.new")[0] || $(".purchase_requests.edit")[0]  
    purchase_request = new App.PurchaseRequest
    purchase_request.renderYourJavascript() 

正如您从我上面的代码中看到的,您可以通过检查$(“.controllers.action”)[0]进行拆分。

您可以将Coffeescript逻辑封装在类中,然后在实际需要调用该逻辑的视图中初始化该类

因此,您的咖啡文件将如下所示:

class YourClass

   constructor: () ->
     # Anything here will be called when this object is instantiated
     @firstMethod()
     @secondMethod()

  firstMethod: () ->
    $('#some-element').click () ->
      alert('hello world')

  secondMethod: () ->
    console.log('second method triggered!')


window.YourClass = YourClass
然后,当您在特定视图中需要此逻辑时,您实际上可以初始化此对象:

<script>
  var yourClass = new YourClass();
</script>

var yourClass=new yourClass();
您甚至可以通过将特定方法移出构造函数方法并在视图中显式调用它们来调用它们:

<script>
  var yourClass = new YourClass();
  yourClass.methodNotInConstructor();
</script>

var yourClass=new yourClass();
yourClass.methodNotInConstructor();

发布两个单独的coffeescript资产示例。我敢打赌,你把他们绑在同一个项目上,这就是为什么他们都参加了比赛。请记住,您可以将coffeescript/js放在不同的文件中,但它们都被编译成一个完整的文件。不同的文件名有助于组织脚本——它们不是名称空间。