AJAX 加载的 JS 不呈现答案

【问题标题】：AJAX-loaded JS not renderingAJAX 加载的 JS 不呈现
【发布时间】：2016-09-10 02:46:41
【问题描述】：

我的 Rails 应用加载了一个包含链接的部分，以及一个为每个链接创建 onClick 事件的脚本。

当页面正常加载（不是通过 AJAX）时，这些链接呈现良好。

但是，当我通过 AJAX 加载部分内容时，这些 onClick 事件不会触发。

当我对 load_links_url 进行 ajax 调用时，其视图包含以下内容：

$("#my_div").html("#{j render('links/links', the_links: @links)}");

onClick 事件未触发。这是为什么呢？

部分links/_links.html.haml 看起来像这样：

-links.each do |link|
    =link_to link.name, "javascript:;", id: "select_link_#{link.id}", class: "select-link", "data-id" => link.id, "data-name" => link.name

:javascript
    $(".select-link").click(function() {
        var id = $(this).data("id");
        var thename = $(this).data("name");
        $('#link_name_header').html(thename);
        $('#creative_session_link_id').val(id);
    })

【问题讨论】：

@sanka 我在上面粘贴的部分文件在不通过 AJAX 呈现时呈现良好，并且 onclick 工作正常。仅当动态呈现时，JS 才不起作用（链接仍然出现，并且 JS 被附加，但 onclick 事件不会触发）。
解决方案调用$(".select-link").动态添加代码后点击代码。
@sanka $('.select-link') 代码是在链接本身呈现后呈现的，如果这就是你的要求的话。
1.渲染静态元素 2.执行事件绑定 3.添加动态内容 4.为动态添加内容再次执行事件绑定 |您在这里缺少第 4 步。
@sanka 我明白了。 javascript 标记也是动态呈现的，它出现在动态呈现链接下方的 DOM 中。不是第四步吗？我错过了什么吗？

标签： javascript jquery ruby-on-rails ajax

【解决方案1】：

看看Jquery event handler not working on dynamic content

总之，对于动态添加的内容，使用 .on 和适当的选择器进行事件委托。比如，在你的情况下：

$('#my_div').on('click', '.select-link', function(){})
or
$(document.body).on('click', '.select-link', function(){})

【讨论】：

不幸的是，这不起作用。即使我在动态加载 HTML 之后执行此代码，它也不起作用。