append()无法使引导组件工作

Question

这让我抓狂，我有这个简单的html bootstrap-gentelella模板，它几乎可以在我开发的站点的每个页面中工作，html是如此简单：(这段代码通过单击"a“标签中的”折叠链接“类，使"x_content”类中的部分可见或不可见)。

<div class="x_panel">
    <ul class="nav navbar-right panel_toolbox">
        <li>
            <a class="collapse-link freccia_feed">Replies
                        <i class="fa fa-chevron-up"></i>
            </a>
        </li>
    </ul>
    <div class="x_content" style="display: none;">
        <div class="input-group col-md-12 col-sm-12 col-xs-12">
            <input data-role="tagsinput" id="risposta_'+j+'_D_'+element+'" class="form-control risposta_domanda_'+element+'" name="reply" value="" placeholder="Insert one solution" type="text">
            <span class="input-group-btn">
                <button  id="elimina_risp_'+j+'_D_'+element+'" class="btn btn-danger glyphicon glyphicon-trash" > </button>
            </span>
        </div>
    </div>
</div>

请注意，像id="risposta_'+j+'_D_'+element+'"这样的部分在这个静态部分中没有任何意义，并按原样呈现，例如，我在jQuery函数中使用了它，但它无法工作！这里：

 $("#domanda_"+element).append(
                        '<div class="x_panel">'+
                        '<ul class="nav navbar-right panel_toolbox">'+
                        '<li>'+
                        '<a class="collapse-link freccia_feed" >Replies'+
                        '<i class="fa fa-chevron-up"></i>'+
                        '</a></li></ul>'+
                        '<div class="x_content" style="display: none;">'+
                        '<div class="input-group col-md-12 col-sm-12 col-xs-12">'+
                        '<input data-role="tagsinput" id="risposta_'+j+'_D_'+element+'" class="form-control risposta_domanda_'+element+'" name="reply"'+
                        'value="" placeholder="Insert one solution" type="text">'+
                        '<span class="input-group-btn"><button  id="elimina_risp_'+j+'_D_'+element+'" class="btn btn-danger glyphicon glyphicon-trash" >'+
                        '</button></span>'+
                        '</div></div></div>');

我已经尝试了很多方法来使这个字符串在append()中工作，唯一可行的方法是用单个'包装整个字符串，使用双"表示ids类，等等，然后用单个'和+注入javascript变量。新产品线也是如此。我甚至尝试使用像https://www.freeformatter.com/javascript-escape.html这样的在线转义工具来转义整个字符串

但仍然是相同的结果，如果附加组件，则组件不起作用！

Answer 1

问题出在gentelella js对类“.closion-link”的“初始化”中。

我甚至添加了一个"unbind()“函数来解决这个问题："inizialization”甚至可以切换所有渲染过的div，让它们打开并关闭几次……这就是代码，如果有人发现它很有用的话

                $(".collapse-link").unbind("click");

                $(".collapse-link").on("click", function() {
                    var a = $(this).closest(".x_panel")
                            , b = $(this).find("i")
                            , c = a.find(".x_content");
                    a.attr("style") ? c.slideToggle(200, function() {
                        a.removeAttr("style")
                    }) : (c.slideToggle(200),
                            a.css("height", "auto")),
                            b.toggleClass("fa-chevron-up fa-chevron-down")
                });