Question

我正在学习Rails，我理解ajax调用是如何工作的。但是我遇到了一个问题：我不知道怎么能用另一个ajax函数绑定DOM中加载的对象的ajax函数。

在我的演示页面中，我使用Plupload插件上传一些文件：当脚本完成上传我加载的文件时，使用ajax，我的预览窗口中的缩略图。一切正常。

        $("#multi_upload").pluploadQueue().bind('UploadComplete', function(up, files) {
          $.ajax({
            type: "GET",
            dataType: 'html',
            url: $('.wmk_grid#large_grid').data('gallery-url'),
            success: function(result) {
              $('.wmk_grid#large_grid').html(result);
            }
          });
        });
        $('.plupload_header').remove();
        }

每个缩略图还有一个“删除”按钮：在这个按钮上我附加了一个轨道ajax调用来删除单个图片。

我的咖啡是这样的：

$ ->
  $('.img_action_remove').bind 'ajax:success', (event, data, status, xhr) ->
    $(this).closest('li').remove()

我知道这个问题：当我加载页面时，我没有.img_action_remove类的任何项目：我在使用plupload上传图片时创建它们。

如何修复第二个ajax调用？

更新：使用此脚本修复：

$(document).on "ajax:success", ".img_action_remove", (e) ->
  $(e.currentTarget).closest("li").remove()

Answer 1

JQuery Delegation

当我加载页面时，我没有任何带有.img_action_remove的项目 class：我用plupload上传图片时创建它们

$('document').on 'ajax:success', '.img_action_remove', (event, data, status, xhr) ->
    $(this).closest('li').remove()

这将事件与文件＆amp;代表们上课。意味着您可以随时创建类，JS应始终捕获事件

Rails Ajax调用ajax上传的图像

1 个答案: