自举崩溃在动态创建时不起作用 [英] bootstrap collapse not working when creating dyanmically

问题描述

我正在通过ajax调用来获取内容，并在运行时创建所有可折叠面板. 但是切换功能无法以这种方式工作.我正在使用骨架木偶集合和项目视图来创建我的面板组.

I am fetching my content via ajax call and creating all the collapsible panel on run time. but toggle functionality is not working in this way. I am using backbone marionette collection and item view for creating my panel-group.

我检查了静态内容，并且对静态数据也能很好地工作.

I checked with static content and it works fine with static data.

我检查了几个链接，但对我来说似乎没有任何作用.

I have checked few links but in my case nothing seems to work.

如何制作Twitter Bootstrap Collapse使用ajax对动态加载的html进行工作

https://github.com/twbs/bootstrap/issues/2274

这是我的html样子:

Here is my html looks like:

<div id="accordion" class="panel-group">
    <div class="panel panel-default">
        <div class="panel-heading">
            <ul class="home_nav" data-toggle="collapse" data-parent="#accordion"
                data-target="NewsMaintenanceMenu">
                ...
            </ul>
            <span class=""><i class="glyphicon glyphicon-chevron-right"></i></span>
        </div>
        <div id="NewsMaintenanceMenu" class="panel-collapse collapse">
            <div class="panel-body">
                <table class="table table-striped">
                    <tbody>
                        ....
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

推荐答案

我暂时使用jQuery.

   $(".panel").on("click", function(e){
              var $_target =  $(e.currentTarget);
              var $_panelBody = $_target.find(".panel-collapse");
              if($_panelBody){
                $_panelBody.collapse('toggle')
              }
        })

这篇关于自举崩溃在动态创建时不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！