Question

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

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/ 手风琴有效，但我解决了两个问题：

第一个问题是“活动”选项不起作用且所有项目都不起作用崩溃了
我的图标选项即使有正确的选项也不起作用图像路径

有什么想法吗？

Answer 1

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

active_item = parseInt(active_item)

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

Answer 2

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

Answer 3

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

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

CSS是：

<style>
        .plus
        {
            background-image:url(../../img/plus.png);
        }
        .minus
        {
            background-image:url(../../img/minus.png);
        }
    </style>

JQuery Accordion默认项目

3 个答案: