javascript - 单击 Controller 操作(远程 : true) and then update href

Question

在单击并跟踪原始链接(remote => true)后，我无法让 Rails link_to 更新其 href。 。相反，它会更新 href，然后遵循新路线。我尝试了 setTimeout (已注释掉)，但这似乎没有帮助。

.html.erb(忽略大多数 div，它只是带有样式的 link_to)

<%= link_to onboarding_favorite_path(:param => f.id), class: "onboarding-favorite", remote: true do %>
  <div style="display:inline-block;float:left" class="onboard-not-chosen">
    <span style="display:none;" class="food_id"><%=f.id%></span>
    <div style="display:inline-block;float:left" class="hovereffect">
      <img class="img-responsive" src=<%=f.image%>>
      <div class="overlay">
        <h2><%=f.name%></h2>
      </div>
    </div>
  </div>
<% end %>

.coffee(忽略从点击到 param 开头的行，该行获取新路线的唯一部分)

$('.onboard-not-chosen').click ->
  $(this).removeClass('onboard-not-chosen').addClass('onboard-chosen')
  $(this).find(".hovereffect").addClass("hovereffect-chosen").removeClass("hovereffect")
  $(this).find(".img-responsive").addClass("img-responsive-chosen").removeClass("img-responsive")
  $(this).find(".overlay").addClass("overlay-chosen").removeClass("overlay")
  param = $(this).find(".food_id").html()
  new_href = "/undo_onboarding_favorite?param=" + param
  original_href = $(this).parent().parent().find(".onboarding-favorite").attr("href")
 #setTimeout ( ->
  $(this).parent().parent().find(".onboarding-favorite").attr("href",new_href)
 #), 1000

我试图让用户选择他们喜欢的食物。选择食物后，链接应该发生变化，以便可以取消选择食物(以防意外选择或改变主意)。应远程遵循路由(onboarding_favorite 和 undo_onboarding_favorite)来更新数据库，然后用户应通过 jQuery 看到更新。

过去，我通过仅使用两个单独的按钮(根据需要隐藏和取消隐藏)来解决此问题，但我认为更新 href 是更好的方法。

Answer 1

如果您使用jquery-ujs(需要使用remote: true)解决方案如下:

$(document).on "ajax:success", ".onboard-favorite", (e, data, status, xhr) ->
  # do your stuff..