Bootstrap Collapse 不适用于 Ajax 创建的内容

Question

我正在使用 Ajax 来获取一些用于在克隆的 div 中设置属性的 [数据]。 在这个 div 中是一个引导手风琴：

<div class='accordion-toggle' data-toggle='collapse' data-target='' style='cursor: pointer;'>
...
</div>

<div class="accordion-body collapse" id="">
...
</div>

在成功的 Ajax 调用中，我正在使用接收到的数据设置手风琴的数据目标和 id，但从不调用崩溃。我什至尝试在克隆后启动崩溃。这是我的 JQuery：

$.ajax({
            ...
            success: function(data) {
                        var id = data.id;
                        var data_target = '#target_' + id;
                        var inventory = $('#inventory_html').clone().attr('id',id);
                        $('.pick_inventory').append($(inventory_i));

                        $('#' + id).find('.accordion-toggle').attr('data-target',data_target);
                        $('#' + id).find('.accordion-body').attr('id',data_target);

                        $('#' + id).find('.collapse').collapse({toggle: false});
}

当我点击手风琴切换时，没有任何反应。有什么帮助吗？

Answer 1

我发现了 2 个小问题：inventory 变量似乎错误，并且可折叠 div 的 ID 中不应包含 #。

试试：

var id = data.id;
var data_target = 'target_' + id;
var inventory = $('#inventory_html').clone().attr('id', id);
$('.pick_inventory').append(inventory);

$('#' + id).find('.accordion-toggle').attr('data-target', '#' + data_target);
$('#' + id).find('.accordion-body').attr('id', data_target);
$('#' + id).find('.collapse').collapse({ toggle: false });