JQuery Аккордеон пункт

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/ Аккордеон работает, но я encouter две проблемы:

1. Первая проблема заключается в что «активная» опция не работает, и все позиции рухнули
2. Функция «Моя кнопка» не работает, даже если есть правильные пути к изображениям

Любые идеи?

Answer 1

jQuery accordion UI уже имеет его по умолчанию + и - иконки.

Это может быть активирована с помощью

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

из docs «активный» может быть логическое значение или 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 2

я не могу помочь вам с иконами, но и для активного элемента, разобрать его на Int

active_item = parseInt(active_item) 

ах и для иконок, то не нужно установить класс, а не путь ?

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>