Question

我正在尝试使用jquery ui手风琴插件，我不知道它为什么不起作用。

我来到http://jqueryui.com/并阅读文档，我选择了一个主题然后我选择了“UI Core toggle all”，然后在小部件中我只选择了“Accordion”。

我将文件保存在“acc”文件夹中，然后导入如下文件：

<link rel="stylesheet" type="text/css" href="../acc/css/jquery-ui-style.css" />
<title>Projet</title>
<script type="text/javascript" src="../acc/js/jquery.js"></script>
<script type="text/javascript" src="../acc/js/jquery-ui.js"></script>
<script type="text/javascript" src="../acc/js/acc.js"></script>

然后在我的 acc.js文件我开始手风琴：

$(function (){
    $('.accordion').accordion();
});

但它没有用，我只有没有手风琴的普通html。

我的HTML 就是这样：

 <div class="accordion">

        <h3>Title 1</h3>    
        <div>
            <p>My first post.</p>
        </div>        

        <h3>Title 2</h3>
        <div>
            <p>My second post.</p>  
        </div>        

        <h3>Title 3</h3>
        <div>
            <p>My third post</p>    
        </div>

    </div><!-- /accordion -->

Answer 1

听起来像你取消选中JqueryUI Core，下载标准版本的JqueryUI并覆盖创建的版本。

fiddle表示代码正确无误。如果你缺少核心，那么没有小工具可以工作

$(function (){
    $('.accordion').accordion();
});

Answer 2

我对jQuery UI手风琴并不完全熟悉，但您是否尝试过放置$（'。accordion'）。accordion（）;在jQuery document.ready中？

请参阅下面的代码，很可能是在页面上的实际html存在之前，您的手风琴正在初始化。假设您正确设置了html，并且包含了正确的jQuery JavaScript文件等。

$(document).ready(function() { 
 $('.accordion').accordion();
});

希望这有帮助。

Answer 3

从您发布的代码中，它应该可以工作，所以我只能假设它没有正确包含您的脚本

如果acc文件夹位于您网站的根文件夹中，您应该考虑将脚本和CSS更改为：

<link rel="stylesheet" type="text/css" href="/acc/css/jquery-ui-style.css" />
<script type="text/javascript" src="/acc/js/jquery.js"></script>
<script type="text/javascript" src="/acc/js/jquery-ui.js"></script>
<script type="text/javascript" src="/acc/js/acc.js"></script>

删除点 - 因为这意味着你试图从你所在的位置找到一个文件夹（在网址中，而不是带有html的文件）。

如果这不起作用，那么按f12并检查你的控制台，你可能有其他js错误阻止手风琴工作

jQuery手风琴它不起作用

3 个答案: