Bootstrap选项卡正在运行,但标签内容未显示

时间:2014-09-27 05:55:39

标签: javascript jquery twitter-bootstrap-3 chart.js

我正在使用html,css和javascripts开发管理仪表板。这是我第一次参与其中。我使用bootstrap作为响应式布局和一些bootstrap js(制表符,折叠)。我还使用chartjs进行饼图和折线图以及sidr响应式菜单。但问题在于引导选项卡和折叠功能。他们没有正常工作。当我点击标签菜单标签正在运行但没有显示其中的图表内容。我花了很多时间来解决这个问题。但我不能。我需要你的帮助。

以下是管理信息中心的链接:http://demo.devkinz.com/admindashboard/

2 个答案:

答案 0 :(得分:0)

您要包含JavaScript,但不会使用它来定位标签元素。从docs开始,您还需要添加一些JavaScript来专门定位这些标签。

或者,您应该可以将data-toggle="tab"添加到每个dashboard_menu li元素中。

答案 1 :(得分:0)

在您的代码中,您有:

<ul class="list-inline pull-right" role="tablist">
  <li class="active"><a href="#ussgemonth" role="tab" data-toggle="tab">Usage</a></li>
  <li><a href="#coletsmonth" role="tab" data-toggle="tab">Monthly</a></li>
</ul>

但你没有.tab-pane的id为id:id =“ussgemonth”&amp; ID = “coletsmonth”

这两个id不仅缺少.tab-pane - 因为这些是嵌套的,你必须遵循与父级相同的结构。