【问题标题】:Why onclick doesn't work on the second page request with turbolinks in Rails4 and coffeescript?为什么 onclick 在 Rails4 和 coffeescript 中的 turbolinks 的第二页请求上不起作用?
【发布时间】:2013-06-12 13:33:54
【问题描述】:

为什么我必须重新加载页面才能使点击回调起作用?

使用 Rails 4.0.0.rc2 我想点击 table-row/table-td 而不是标准链接。 table-row 有一个 css-class,并且当单击该行时,coffee-script 应该加载正确的 url。

下面显示的代码第一次运行良好并重定向到正确的目标。 当我然后单击菜单(使用 turbolink 处理)以显示原始表格时,除非我重新加载表格,否则对任何表格行的点击都不起作用。

我的haml模板看起来像这样

....
%tr{class: 'clickable-row', id: 'row-id-1'}
  %td Some text
  %td more text
%tr{class: 'clickable-row', id: 'row-id-2'}
  %td ...
  %td ...

咖啡脚本:

jQuery ->
  $('.clickable-row td').click ->
    target_id = $(this).parent().attr('id').replace /row-id-/,''
    document.location = "/controller_xy/#{target_id}/edit"

【问题讨论】:

  • 伊维特,谢谢你的提示。我是新来的(作为海报)并更改了标题。
  • 在运行 jQuery 之后是否添加了更多 .clickable-row td 元素?
  • 不,链接只是返回到带有表格的页面。也没有涉及其他 javascipts。

标签: onclick coffeescript ruby-on-rails-4


【解决方案1】:

不过,这不是“为什么”问题的答案,但至少是一种解决方法。

工作的咖啡脚本如下所示:

jQuery ->

  $(document).on( 'click', '.clickable-row td', ->
    target_id = $(this).parent().attr('id').replace /row-id-/, ''
    document.location = "/controller_xy/#{target_id)}/edit"
  )

【讨论】:

    【解决方案2】:

    这里还有另一个更简单的解决方案。

    当您使用自 Rails 4 以来默认的 turbolinks 时,还包括 jquery.turbolinks gem

    说明很简单。

    1. 在您的 Gemfile 中添加:gem 'jquery-turbolinks'
    2. 在您的 JavaScript 清单中(默认:app/assets/javascripts/application.js.coffee):
      需要 jquery.turbolinks 紧接在 jquery 之后。
      在您的脚本之后需要turbolinks

    例子:

    #= require jquery
    #= require jquery.turbolinks
    #= require jquery_ujs
    
    # ... your other scripts here ...
    
    #= require turbolinks
    

    【讨论】:

    • 这在 Rails 5 中已被弃用
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-08-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多