Question

我正在使用bootstrap模板创建网站有一个带有treeview结构的侧边栏当我为所有页面动态公共时（使用jquery）它停止了工作。我为此使用了一个名为sidebar.html的单独文件。

我使用此代码使所有页面的侧边栏都是通用的。

<script> 
$(document).ready(function(){
   $("#sidebar").load("sidebar.html"); 
  $("#footer").load("footer.html"); 
  });
</script>

这是我的引导边栏代码

<aside class="main-sidebar">
    <section class="sidebar">
        <ul class="sidebar-menu" >
            <li class="active treeview">
                <a href="#">
                    <i class="fa fa-globe"></i> <span>Regions</span>
                </a>
                <ul class="treeview-menu">
                    <li class="active"><a href="index.html" class=""><i class="fa fa-stop"></i> Americas</a></li>
                    <li><a href="index2.html"><i class="fa fa-stop"></i> Europe</a></li>
                    <li ><a href="index.html"><i class="fa fa-stop"></i> Eurasia</a></li>
                    <li><a href="index2.html"><i class="fa fa-stop"></i> Sub-Saharan Africa</a></li>
                    <li ><a href="index.html"><i class="fa fa-stop"></i> Asian-Pacific</a></li>
                    <li><a href="index2.html"><i class="fa fa-stop"></i> Middle East</a></li>
                    <li><a href="index2.html"><i class="fa fa-stop"></i> North Africa</a></li>
                    <li class="gray-li" >
                        <form action="#" method="get" class="sidebar-form" >
                            <div class="input-group"  >
                                <input type="text"  class="form-control   " placeholder="Search for a country">
                                    <span class="input-group-btn">
                                        <button type="submit" name="search" id="Button1" class="btn btn-flat"><i class="fa fa-search"></i>
                                        </button>
                                    </span>
                            </div>
                        </form>
                    </li>
                </ul>
            </li>
            <li class="treeview">
                <a onclick="javascript:location.href='page-7.html'" >
                    <img src="img/group_icon.png"/>
                    <span >Institutions</span>
                </a>
                <ul class="treeview-menu">
                    <li class="active"><a href="page-7.html" class=""><i class="fa fa-stop"></i> Americas</a></li>
                    <li><a href="index2.html"><i class="fa fa-stop"></i> Europe</a></li>
                    <li ><a href="index.html"><i class="fa fa-stop"></i> Eurasia</a></li>
                    <li><a href="index2.html"><i class="fa fa-stop"></i> Sub-Saharan Africa</a></li>
                    <li ><a href="index.html"><i class="fa fa-stop"></i> Asian-Pacific</a></li>
                    <li><a href="index2.html"><i class="fa fa-stop"></i> Middle East</a></li>
                    <li><a href="index2.html"><i class="fa fa-stop"></i> North Africa</a></li>
                    <li class="gray-li">
                        <form action="#" method="get" class="sidebar-form">
                            <div class="input-group" >
                                <input type="text" name="q" class="form-control" placeholder="Search for a country">
                                    <span class="input-group-btn">
                                        <button type="submit" name="search" id="Button2" class="btn btn-flat"><i class="fa fa-search"></i>
                                        </button>
                                    </span>
                            </div>
                        </form>
                    </li>
                </ul>
            </li>
            <li class="treeview">
                <a href="#">
                    <i class="fa fa-line-chart"></i>
                    <span>Comparations</span>
                </a>
                <ul class="treeview-menu">
                    <li><a onclick="javascript:location.href='page-11.html'"  ><i class="fa fa-stop"></i>Por Pa&iacute;s</a></li>
                    <li><a  onclick="javascript:location.href='page-13.html'"><i class="fa fa-stop"></i> Cluster</a></li>
                </ul>
            </li>
        </ul>
    </section>
</aside>

Answer 1

你正在上课，所以试试这个：

$(document).ready(function(){
    $(".sidebar").load("sidebar.html"); 
    $(".footer").load("footer.html"); 
});

当我为所有页面动态播放时，我的侧边栏的可打开面板无法正常工作

1 个答案: