Coffeescript 和 jQuery 在特定视图的 Rails 上使用 Ruby 无法正常工作

Question

我在 Rails (4.1.4) 上与 Ruby 有 javascript 问题。它只有一个控制器，我不明白为什么-有人知道吗？谢谢你。

####This works :)
$(document).on "turbolinks:load", ->
  $('#redemption_amount').keyup updateWorth
  $('#redemption_amount').change updateWorth

 updateWorth = ->
    discount = ($('#discount').val() / 100)
    worth = $(this).val() * discount
    $('#redemption_worth').html(worth.toFixed(2))
#####

这是问题所在：

####This does not work :(
$(document).on "turbolinks:load", ->
  $('#purchase_amount').keyup updatePoints
  $('#purchase_amount').change updatePoints

  updatePoints = ->
        points = (Math.round($(this).val() * 0.92))
        $('#purchase_points').html(points)
####

Answer 1

缩进定义了 CoffeeScript 代码的结构，因此如果您的缩进关闭，那么您的代码也将关闭。

第一种情况：

$(document).on "turbolinks:load", ->
  $('#redemption_amount').keyup updateWorth
  $('#redemption_amount').change updateWorth

 updateWorth = ->
    discount = ($('#discount').val() / 100)
    worth = $(this).val() * discount
    $('#redemption_worth').html(worth.toFixed(2))

JavaScript 看起来像：

var updateWorth;
$(document).on("turbolinks:load", function() {
  $('#redemption_amount').keyup(updateWorth);
  $('#redemption_amount').change(updateWorth);
});
updateWorth = function() { ... };

所以当 keyup 和 change 被调用时，updateWorth 的值是一个函数并且一切正常。

第二种情况：

$(document).on "turbolinks:load", ->
  $('#purchase_amount').keyup updatePoints
  $('#purchase_amount').change updatePoints

  updatePoints = ->
        points = (Math.round($(this).val() * 0.92))
        $('#purchase_points').html(points)

JavaScript 最终变成这样：

$(document).on("turbolinks:load", function() {
  var updatePoints;
  $('#purchase_amount').keyup(updatePoints);
  $('#purchase_amount').change(updatePoints);

  updatePoints = function() { ... };
});

您的缩进将 updatePoints 放在回调中。当调用keyup和change时，updatePoints的值为undefined，因为updatePoints = function() { ... }部分还没有到达。

经验法则：

在使用它们之前先定义它们（按代码的行顺序）。
要非常小心并与你的空格保持一致：如果你在一个地方缩进两个空格然后缩进两个空格到处.

你应该说：

updateWorth = ->
  discount = $('#discount').val() / 100
  worth = $(@).val() * discount
  $('#redemption_worth').html(worth.toFixed(2))

$(document).on "turbolinks:load", ->
  $('#redemption_amount').keyup updateWorth
  $('#redemption_amount').change updateWorth

和：

updatePoints = ->
  points = (Math.round($(@).val() * 0.92))
  $('#purchase_points').html(points)

$(document).on "turbolinks:load", ->
  $('#purchase_amount').keyup updatePoints
  $('#purchase_amount').change updatePoints

Coffeescript 和 jQuery 在特定视图的 Rails 上使用 Ruby 无法正常工作

Coffeescript and jQuery not working using Ruby on Rails on a particular view

jquery

ruby-on-rails

coffeescript

ruby-on-rails-4