3

我正在尝试根据我在 stackoverflow 中研究的内容来修改手风琴，但高度仍然没有改变——它仍然是最高面板的高度。有人可以告诉我我做错了什么或错过了什么吗？这是我在 HEAD 中输入的内容——

<link rel="stylesheet"   href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<script>
$(function() {
$( "#accordion" ).accordion({
  collapsible: true
});
</script>
<script>
$(".selector").accordion({ autoHeight: false }); 
</script>

谢谢你。

4

6 回答 6

19

您的现有代码存在三个问题。以下代码应该适合您：

$(function() {
    $("#accordion" ).accordion({
        collapsible: true,
        heightStyle: "content"
    });
});
  1. 您没有使用相同的选择器来设置您的手风琴。
  2. 您没有将以后的代码放在 a 中.ready()，因此如果手风琴 HTML 位于脚本标签下方，它将无法正常工作。
  3. jQuery 手风琴没有 autoHeight 选项。根据您应该一直在使用 heightStyle 的文档。

如果这些更改没有解决您的问题，请同时提供您的 HTML。

于 2013-09-11T19:10:38.217 回答
3

这对我有用：

<script type="text/javascript">
$(function() {
    $( "#accordion" ).accordion({ heightStyle: "content", autoHeight: false, });
});
</script>

干杯。

于 2014-02-01T18:46:54.960 回答
2

尝试这个：

<script>
    $(function() {
        $( "#accordion" ).accordion({
            heightStyle: "content"
        });
    });
</script>
于 2013-09-11T19:15:13.473 回答
2

这解决了我的问题

  $(function() {
    $( "#accordion" ).accordion({
       collapsible: true,
       autoHeight: false
    });
  });
于 2014-06-09T21:56:20.323 回答
1

您正在寻找，

heightStyle: "content"

如中，

<script type="text/javascript">
$(function() {
    $( "#accordion" ).accordion({ heightStyle: "content" });
 });
</script>

从文档中：

设置 heightStyle: "content" 允许手风琴面板保持其原始高度。

编辑：我就是为什么人们建议 autoHeight: false，因为这甚至不是 .accordion 的选项。在此处查看 api 以获得完整的选项列表：http: //api.jqueryui.com/accordion/

于 2013-09-11T19:14:42.813 回答
0

@Nikos Gr 的答案应该是你所需要的，只有你选择将脚本插入到外部文件中，确保在链接到所有 jquery UI 文件之后链接到 HTML 中的脚本，如下所示：

首先你的 jQuery 文件

<link rel="stylesheet" href="../JQUERY/jquery-ui-1.12.1.custom/jquery-ui.min.css">
<script src="../JQUERY/jquery-ui-1.12.1.custom/external/jquery/jquery.js">
</script>
<script src="../JQUERY/jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>

然后你自己的js

<script src="animate.js"></script>

在该文件中，包含@Nikos GR 编写的代码以及@Josh Mein 的提示：

$(document).ready(function () {

    $("#accordion").accordion({
        heightStyle: "content"
    });

});

那应该工作得很好！如果您希望脚本在您的 HTML 中，请执行相同操作，但在“”元素中没有“src”属性<script>。

于 2016-10-13T08:56:22.013 回答