javascript – 如何实现twitter bootstrap手风琴?

我正在尝试实现twitter bootstrap崩溃插件( http://twitter.github.io/bootstrap/2.3.2/javascript.html#collapse),我似乎无法让它工作.认为我的开发环境有问题,我设置了一个JSfiddle,我仍然遇到同样的问题.这是jsfiddle

http://jsfiddle.net/qdqrT/1/

这是直接从bootstrap示例复制的HTML.

<div class="accordion" id="accordion2">
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapSEOne">
        Collapsible Group Item #1
      </a>
    </div>
    <div id="collapSEOne" class="accordion-body collapse in">
      <div class="accordion-inner">
        Anim pariatur cliche...
      </div>
    </div>
  </div>
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
        Collapsible Group Item #2
      </a>
    </div>
    <div id="collapseTwo" class="accordion-body collapse">
      <div class="accordion-inner">
        Anim pariatur cliche...
      </div>
    </div>
  </div>
</div>

CSS和javscript直接来自bootstrap定制页面,只有崩溃的CSS和JS,以及trasition JS(它是崩溃插件的依赖项).

有谁知道为什么这个坏了?

解决方法

我搞定了.我想你可能没有包括所有必需的资源.

我最终在BootstrapCDN中包含了一个托管版本的bootstrap CSS和JS

<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">

这是工作版本:http://jsfiddle.net/qdqrT/3/

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...