0

在我的项目中，我成功地使用了 UIKit（直到现在）。最近我第一次尝试使用 UIKit 手风琴，但失败了。

所以我将代码简化为这个

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8" />
   <link rel="stylesheet" href="css/uikit.min.css" />
   <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
   <script src="js/uikit.min.js"></script>
</head>
<body>
<div class="uk-accordion" data-uk-accordion>

    <h3 class="uk-accordion-title">Test 1</h3>
    <div class="uk-accordion-content">Whatever</div>

    <h3 class="uk-accordion-title">Test 2</h3>
    <div class="uk-accordion-content">Everything else</div>

    <h3 class="uk-accordion-title">Test 3</h3>
    <div class="uk-accordion-content">All the rest</div>

</div>
</body>
</html>

它不起作用。

我尝试了不同版本的 UIKit 和 jquery ......没有效果。

jsbin（http://jsbin.com/fusapomoze）上的这个例子也不起作用

https://getuikit.com/docs/accordion.html上的文档显示了它应该如何工作......

4

2 回答 2

0

这太容易了

文档不是很清楚，您需要在 HTML 的头部添加（一些）组件

<link rel="stylesheet" href="css/uikit.min.css" />
<link rel="stylesheet" href="css/components/accordion.min.css" />
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="js/uikit.min.js"></script>
<script src="js/components/accordion.min.js"></script>
于 2016-11-10T10:02:36.700 回答
0

我有同样的问题......我找到了答案:)

您必须在页面中加载手风琴组件。在您的 JS Bin 示例中，在 :<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/accordion.min.js"></script>下添加一行uikit.min.js。

所以它有效:)

另请参阅您提供的文档页面的源代码，您会找到诀窍；-)

希望它会帮助你。

于 2016-11-10T10:06:13.710 回答