javascript - 让 Coffeescript 找到正确的 div // 条纹错误

Question

在 Ryan Bates 的教程的帮助下，我能够设置 Stripe。现在，我试图让用户更新他们的信用卡信息。

现在我挂断了当点击操作按钮时能够调用条带。造成这种情况的可能原因是，我通过基本上复制 Ryan 的代码来制作新信用卡，将咖啡脚本破解了。

这是我用来输入新信用卡信息的表格

<%= form_tag("/users/update_card", :method => "put", :class => "edit_user", :id => "change_card" ) do %>
  <%= hidden_field_tag :stripe_card_token %>

  <div id="stripe_error" class="alert">   
      <noscript>JavaScript is not enabled and is required for this form. First enable it in your web browser settings.</noscript>
  </div>

    <div class="field">
      <%= label_tag :card_number, "Credit Card Number" %>
      <%= text_field_tag :card_number, nil, name: nil %>
    </div>
    <div class="field">
      <%= label_tag :card_code, "Security Code on Card (CVV)" %>
      <%= text_field_tag :card_code, nil, name: nil %>
    </div>
    <div class="field">
      <%= label_tag :card_month, "Card Expiration" %>
      <%= select_month nil, {add_month_numbers: true}, {name: nil, id: "card_month"} %>
      <%= select_year nil, {start_year: Date.today.year, end_year: Date.today.year+15}, {name: nil, id: "card_year"} %>
    </div>


  <%= submit_tag("Update My Credit Card", :class => "button") %>

这是我正在使用的 Coffeescript。前半部分包括新用户的注册（有效），后半部分从 changecard.setupForm() 开始，不

# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/

jQuery ->
  Stripe.setPublishableKey($('meta[name="stripe-key"]').attr('content'))
  subscription.setupForm()

subscription =
  setupForm: ->
    $('#new_user').submit ->
      $('input[type=submit]').attr('disabled', true)
      if $('#card_number').length
        subscription.processCard()
        false
      else
        true

  processCard: ->
    card =
      number: $('#card_number').val()
      cvc: $('#card_code').val()
      expMonth: $('#card_month').val()
      expYear: $('#card_year').val()
    Stripe.createToken(card, subscription.handleStripeResponse)

  handleStripeResponse: (status, response) ->
    if status == 200
      $('#user_stripe_card_token').val(response.id)
      $('#new_user')[0].submit()
    else
      $('#stripe_error').text(response.error.message)
      $('input[type=submit]').attr('disabled', false)

changecard.setupForm()

changecard =
  setupForm: ->
    $('#change_card').submit ->
      $('input[type=submit]').attr('disabled', true)
      if $('#card_number').length
        subscription.processCard()
        false
      else
        true

  processCard: ->
    card =
      number: $('#card_number').val()
      cvc: $('#card_code').val()
      expMonth: $('#card_month').val()
      expYear: $('#card_year').val()
    Stripe.createToken(card, subscription.handleStripeResponse)

  handleStripeResponse: (status, response) ->
    if status == 200
      $('#user_stripe_card_token').val(response.id)
      $('#change_card')[0].submit()
    else
      $('#stripe_error').text(response.error.message)
      $('input[type=submit]').attr('disabled', false)

这是我的 update_card 操作

  def update_card
  @user = current_user
  cu = Stripe::Customer.retrieve(@user.stripe_customer_token)
  cu.card = params[:stripe_customer_token] # obtained with Stripe.js
  cu.save
  redirect_to edit_user_path(@user)
  end

感谢您坚持到这一步！非常感谢您的想法。

编辑

单步执行 javascript 后，它暂停了

changecard.setupForm()  

那是我从 :P 开始的那一行。错误是

uncaught TypeError: Cannot call method 'setupForm' of undefined

似乎没有使用我上面放置的咖啡脚本正确定义 changecard。我不确定如何更改它，非常感谢任何帮助！

编辑 2

使用 javascript 调试，这是最终代码，它似乎提供了 stripe_card_token

**# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/
jQuery ->
  Stripe.setPublishableKey($('meta[name="stripe-key"]').attr('content'))
  subscription.setupForm()
  changecard.setupForm()
subscription =
  setupForm: ->
    $('#new_user').submit ->
      $('input[type=submit]').attr('disabled', true)
      if $('#card_number').length
        subscription.processCard()
        false
      else
        true

  processCard: ->
    card =
      number: $('#card_number').val()
      cvc: $('#card_code').val()
      expMonth: $('#card_month').val()
      expYear: $('#card_year').val()
    Stripe.createToken(card, subscription.handleStripeResponse)

  handleStripeResponse: (status, response) ->
    if status == 200
      $('#user_stripe_card_token').val(response.id)
      $('#new_user')[0].submit()
    else
      $('#stripe_error').text(response.error.message)
      $('input[type=submit]').attr('disabled', false)
changecard =
  setupForm: ->
    $('#change_card').submit ->
      $('input[type=submit]').attr('disabled', true)
      if $('#card_number').length
        changecard.processCard()
        false
      else
        true

  processCard: ->
    card =
      number: $('#card_number').val()
      cvc: $('#card_code').val()
      expMonth: $('#card_month').val()
      expYear: $('#card_year').val()
    Stripe.createToken(card, changecard.handleStripeResponse)

  handleStripeResponse: (status, response) ->
    if status == 200
      $('#stripe_card_token').val(response.id)
      $('#change_card')[0].submit()
    else
      $('#stripe_error').text(response.error.message)
      $('input[type=submit]').attr('disabled', false)**

Answer 1

编辑 2

使用 javascript 调试，这是最终代码，它似乎提供了 stripe_card_token

**# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/
jQuery ->
  Stripe.setPublishableKey($('meta[name="stripe-key"]').attr('content'))
  subscription.setupForm()
  changecard.setupForm()
subscription =
  setupForm: ->
    $('#new_user').submit ->
      $('input[type=submit]').attr('disabled', true)
      if $('#card_number').length
        subscription.processCard()
        false
      else
        true

  processCard: ->
    card =
      number: $('#card_number').val()
      cvc: $('#card_code').val()
      expMonth: $('#card_month').val()
      expYear: $('#card_year').val()
    Stripe.createToken(card, subscription.handleStripeResponse)

  handleStripeResponse: (status, response) ->
    if status == 200
      $('#user_stripe_card_token').val(response.id)
      $('#new_user')[0].submit()
    else
      $('#stripe_error').text(response.error.message)
      $('input[type=submit]').attr('disabled', false)
changecard =
  setupForm: ->
    $('#change_card').submit ->
      $('input[type=submit]').attr('disabled', true)
      if $('#card_number').length
        changecard.processCard()
        false
      else
        true

  processCard: ->
    card =
      number: $('#card_number').val()
      cvc: $('#card_code').val()
      expMonth: $('#card_month').val()
      expYear: $('#card_year').val()
    Stripe.createToken(card, changecard.handleStripeResponse)

  handleStripeResponse: (status, response) ->
    if status == 200
      $('#stripe_card_token').val(response.id)
      $('#change_card')[0].submit()
    else
      $('#stripe_error').text(response.error.message)
      $('input[type=submit]').attr('disabled', false)**