0

我正在尝试在手风琴菜单中定义默认活动项目：

function activate_accordion(course_id){
        var active_item = '';
        if (course_id == false){
            active_item = false;
        }
        else {
            active_item = $('.accordion div[id="course-' + course_id + '"]').attr('active');
        }

        alert(active_item);
        var icons = {
                header: "../../img/plus.png",
                activeHeader: "../../img/minus.png"
            };

        $( ".accordion" ).accordion({
            collapsible: true,
            icons: icons,
            active: active_item,
            heightStyle: "content"
        });
    }

我的 JsFiddle： http: //jsfiddle.net/fvMre/ 手风琴有效，但我遇到了两个问题：

  1. 第一个问题是“活动”选项不起作用，所有项目都折叠了
  2. 即使有正确的图像路径，我的图标选项也不起作用

有任何想法吗？

4

3 回答 3

1

我们可以通过“CSS”类名加载图像。

var icons = {
                header: "plus",
                activeHeader: "minus"
            };

CSS是：

<style>
        .plus
        {
            background-image:url(../../img/plus.png);
        }
        .minus
        {
            background-image:url(../../img/minus.png);
        }
    </style>
于 2013-07-19T10:14:16.947 回答
1

jQuery accordion UI已经有其默认的+和-图标。

这可以使用激活

icons: {
            "header": "ui-icon-plus",
            "activeHeader": "ui-icon-minus"
        }

从docs开始，“active”可以是 bool 或 int 0 和 1。由于您的代码返回数字，因此您可以按照 reyaner 所说的进行操作。

 active: parseInt(active_item)

最后你的accordion代码应该像

$(".accordion").accordion({
        collapsible: true,
        active: parseInt(active_item),
        heightStyle: "content",
        icons: {
            "header": "ui-icon-plus",
            "activeHeader": "ui-icon-minus"
        }
    });

检查这个JSFiddle

于 2013-07-19T09:41:08.407 回答
1

我无法帮助您处理图标，但对于活动元素，将其解析为 Int

active_item = parseInt(active_item)

啊，对于图标，您不必设置类而不是路径吗？

于 2013-07-19T09:30:24.677 回答