javascript - 当创建和销毁都是 AJAX 时，在 DOM 中找不到 ID

Question

我遇到了一个问题，我允许用户创建项目，但他们也可以从同一页面删除该项目。

目前，当用户添加项目时，它会通过 create.js.erb 添加到网站，现在我还添加了销毁该项目的功能。如果他们点击删除，该方法就会被删除，但我无法将其从网站中删除。

原因是，如果我在控制台中运行 $('item-13') f.ex，则在 DOM 中找不到它，因为它是通过 AJAX 添加的。所以我遇到的问题是在我的 destroy.js.erb 中我有:

$("#item-<%= @current_item %>").remove();

我的破坏行动:

  def destroy
   @line_item = @cart.line_items.find(params[:id])
    respond_to do |format|
     format.js { @current_item = @line_item.id }
    end
  end

如何才能找到我附加到创建项目时显示该项目的 div 的 id？

重新加载页面后，我可以基于 AJAX 删除 div。

Answer 1

jQuery 选择将查看当前 dom，即它将包括使用 Ajax 添加的对象。

我认为问题在于您已经在 Controller 中定义了处理 js 请求的 block ，在这一行中:

format.js { @current_item = @line_item.id }

这意味着它不会继续渲染destroy.js.erb - 如果没有定义其他内容，这是默认操作。

我会通过将所有内容移至 destroy.js.erb 来解决此问题:

#controller
def destroy
 @line_item = @cart.line_items.find(params[:id])
  respond_to do |format|
   format.js 
  end
end

#destroy.js.erb
$("#item-<%= @line_item.id %>").remove();