jQuery 不会作用于 Rails 中通过 AJAX 呈现的部分内容答案

【问题标题】：jQuery won't act on a partial rendered through AJAX in RailsjQuery 不会作用于 Rails 中通过 AJAX 呈现的部分内容
【发布时间】：2013-08-08 01:04:49
【问题描述】：

我的应用程序有一个叫做“备忘录”的东西。您可以使用备忘录中的@标签回复其他备忘录。例如：

您好，这是对@123 的回复

然后，如果您单击 @123，则备忘录 #123 将呈现在您正在查看的备忘录下方。

_memo.html.erb：

<div class="memo">
    <div class="memo-content">
        <%= raw simple_format(memo.content).gsub(/@([a-z0-9A-Z]+)/, '<a  data-remote="true" class="marker" href="/memos/\1">@\1</a>')%>
    </div>
</div>

app/assets/javascripts/memo.js：

$(function() {
    $(".marker").on("ajax:success", function(e, content){
        console.log("hi")
        $(".memos-container").append(content);
    });
})

memos_controller.rb:

  def show
    @memo = Memo.find(params[:id])
    if request.xhr?
      render partial: "shared/memo", locals: { memo: @memo } 
    end
  end

第一次点击效果很好。如果我单击@123，则会在页面中呈现备忘录#123。如果我单击第一个备忘录中的任何其他@标签，它们也都可以工作。

问题是，呈现的备忘录中没有任何内容是可点击的。因此，如果备忘录#123 也有一个@456 标记，并且我单击它，则不会呈现任何内容。

在 Chrome 中查看我的网络控制台，它正在发出get 请求，只有 jQuery 没有作用于那些新呈现的 DOM 元素。

我看过关于 SO 的类似问题，他们都说使用 .on，据我所知，这就是我在做什么。但我完全是 Javascript 新手。

【问题讨论】：

您的click 处理程序在哪里？具体来说，你使用.click(...)，还是使用.on('click'...)？
@Amadan 这就是所有的代码。 Ajax 请求成功：api.jquery.com/ajaxSuccess
哎呀，我错过了data-remote...
@Amadan doh 我自己，我应该更好地阅读文档，因为我在重新阅读之后让它工作（在下面发布了答案）。但如果有更好的方法可以做到这一点，我愿意接受建议。

标签： jquery ruby-on-rails ajax dom ujs

【解决方案1】：

我通过使用它来工作：

$(function() {
    $(document).ajaxSuccess(function(e, content){
        console.log(content.responseText)
        $(".memos-container").append(content.responseText);
    });
})

但如果有更好的方法可以做到这一点，我愿意接受建议:)

现在 turbolinks 让它表现得非常不稳定。但这是一个不同的话题......

【讨论】：