jQuery 不会对 Rails 中通过 AJAX 渲染的部分起作用

Question

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

Hi this is a reply to @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 新手。

Answer 1

我用这个让它工作:

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

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

现在 Turbolinks 让它变得很奇怪。但这是另一个话题了...