在Rails中使用UJS时，ajax：success和ajax：complete回调不起作用

Question

我有一个链接，当我单击它时会触发ajax调用，然后用另一个链接替换此链接，例如说原始链接是“添加朋友”，当我单击此链接时，它将向ajax请求发送一个ajax请求给add_friend操作，然后如果添加了朋友，则上面的链接将被另一个链接“取消请求”替换，我为此使用ujs：

$("#link_for_friend").html("<%= escape_javascript(render('users/cancel_link')) %>")

当我尝试添加回调（：success和：complete）时不起作用，我尝试了：beforeSend，如下所示：

$(document).ready ->
  $("#my_link").on "ajax:beforeSend", ->
    alert("hello")

有成功和完整回调的解决方案吗？

注意：我的想法是在ajaxStart触发时显示loader.gif，然后在ajax：complete回调至少触发时隐藏它，如果有一些错误，我想在ajax：error触发时显示它

更新资料

我试图通过将action.js.erb内部的代码移动到js文件来解决此问题，如下所示：

  $(document).ready ->
  $(document).on("ajax:success", "a.invitation-box", ->
    $("#link_for_friend").html("<%= escape_javascript(render('users/cancel_link')) %>")
  ).on "ajax:error", "a.invitation-box", ->
    alert "error"

但是这样无法将render（’users / cancel_link’）放入JS文件中

Answer 1

我有同样的问题，问题不在于ajax：success或ajax：complete回调。问题在于，当显示加载的gif图像时，您将替换容器的内容，包括链接本身。因此，在其上应用成功，完整回调的元素不再是DOM的一部分，这就是为什么不触发该回调的原因。

一种解决方案是隐藏元素并附加加载图像，如下所示：

$('#my_link').on "ajax:send", (event, xhr, settings) ->
        $('#my_link').hide()
        $("#my_link_container").append("<image src = 'img.gif' />")

然后将触发成功和完整的回调。希望它对某人有帮助:)