Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: Помогите разобраться с кодом

 PHP.SU

Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Без описания
Altynayka
Отправлено: 03 Декабря, 2012 - 09:27:17
Post Id


Частый гость


Покинул форум
Сообщений всего: 208
Дата рег-ции: Март 2008  


Помог: 0 раз(а)




У меня есть дерево списков
CODE (htmlphp):
скопировать код в буфер обмена
  1. <div id="work-cat-select-wrapper" class="">
  2.     <div class="item-lists">
  3.         <div class="item-list ul0 tree jquery-tree classic">
  4.             <ul>
  5.                 <li class="first">
  6.                     <span class="work-cat-lis">
  7.                         <a href="/">Работа в офисе</a>
  8.                     </span>
  9.                     <div class="term-description"></div>
  10.                     <div class="item-list">
  11.                         <ul>
  12.                             <li class="first">
  13.                                 <span class="work-cat-lis">
  14.                                     <a href="/">111</a>
  15.                                 </span>
  16.                                 <div class="term-description"></div>
  17.                                 <div class="item-list">
  18.                                     <ul>
  19.                                         <li class="first">
  20.                                             <span class="work-cat-lis">
  21.                                                 <a href="/">111-AA</a>
  22.                                             </span>
  23.                                             <div class="term-description"></div>
  24.                                             <div class="item-list">
  25.                                                 <ul>
  26.                                                     <li class="first">
  27.                                                         <i id="work-cat-item-245" class="active" rel="245">111-AA-aa</i>
  28.                                                     <div class="term-description"> </div>
  29.                                                     </li>
  30.                                                     <li>
  31.                                                         <i id="work-cat-item-246" class="" rel="246">111-AA-bb</i>
  32.                                                         <div class="term-description"> (...)</div>
  33.                                                     </li>
  34.                                                     <li class="last">
  35.                                                         <i id="work-cat-item-244" class="" rel="244">111-AA-ccc</i>
  36.                                                         <div class="term-description"> </div>
  37.                                                     </li>
  38.                                                 </ul>
  39.                                             </div>
  40.                                         </li>
  41.                                         <li class="last">
  42.                                             <i id="work-cat-item-221" class="" rel="221">111-BB</i>
  43.                                             <div class="term-description"> </div>
  44.                                         </li>
  45.                                     </ul>
  46.                                 </div>
  47.                             </li>
  48.                                 <li class="last">
  49.                                     <span class="work-cat-lis">
  50.                                         <a href="/">222</a>
  51.                                     </span>
  52.                                 <div class="term-description"></div>
  53.                                 <div class="item-list">
  54.                                 <ul>
  55.                                     <li class="first">
  56.                                     <span class="work-cat-lis">
  57.                                         <a href="/">222-AA</a>
  58.                                     </span>
  59.                                     <div class="term-description"></div>
  60.                                     <div class="item-list">
  61.                                         <ul>
  62.                                             <li class="first last">
  63.                                               <i id="work-cat-item-241" class="" rel="241">222-AA-aa</i>
  64.                                               <div class="term-description"> </div>
  65.                                             </li>
  66.                                         </ul>
  67.                                     </div>
  68.                                     </li>
  69.                                     <li class="last">
  70.                                         <span class="work-cat-lis">
  71.                                         <a href="/">222-BB</a>
  72.                                     </span>
  73.                                     <div class="term-description"></div>
  74.                                     <div class="item-list">
  75.                                         <ul>
  76.                                             <li class="first">
  77.                                                 <i id="work-cat-item-243" class="" rel="243">222-BB-aa</i>
  78.                                                 <div class="term-description"> (...)</div>
  79.                                             </li>
  80.                                             <li class="last">
  81.                                                 <i id="work-cat-item-242" class="" rel="242">222-BB-bb</i>
  82.                                                 <div class="term-description"> (...)</div>
  83.                                             </li>
  84.                                         </ul>
  85.                                     </div>
  86.                                     </li>
  87.                                 </ul>
  88.                                 </div>
  89.                             </li>
  90.                         </ul>
  91.                     </div>
  92.                 </li>
  93.                 <li class="first">
  94.                     <span class="work-cat-lis">
  95.                         <a href="/">Работа в не офиса</a>
  96.                     </span>
  97.                     <div class="term-description"></div>
  98.                     <div class="item-list">
  99.                         <ul>
  100.                             <li class="first">
  101.                                 <span class="work-cat-lis">
  102.                                     <a href="/">1111</a>
  103.                                 </span>
  104.                                 <div class="term-description"></div>
  105.                                 <div class="item-list">
  106.                                     <ul>
  107.                                         <li class="first">
  108.                                             <span class="work-cat-lis">
  109.                                                 <a href="/">1111-AA</a>
  110.                                             </span>
  111.                                             <div class="term-description"></div>
  112.                                             <div class="item-list">
  113.                                                 <ul>
  114.                                                     <li class="first">
  115.                                                         <i id="work-cat-item-245" class="active" rel="245">1111-AA-aa</i>
  116.                                                     <div class="term-description"> </div>
  117.                                                     </li>
  118.                                                     <li>
  119.                                                         <i id="work-cat-item-246" class="" rel="246">1111-AA-bb</i>
  120.                                                         <div class="term-description"> (...)</div>
  121.                                                     </li>
  122.                                                     <li class="last">
  123.                                                         <i id="work-cat-item-244" class="" rel="244">1111-AA-ccc</i>
  124.                                                         <div class="term-description"> </div>
  125.                                                     </li>
  126.                                                 </ul>
  127.                                             </div>
  128.                                         </li>
  129.                                         <li class="last">
  130.                                             <i id="work-cat-item-221" class="" rel="221">1111-BB</i>
  131.                                             <div class="term-description"> </div>
  132.                                         </li>
  133.                                     </ul>
  134.                                 </div>
  135.                             </li>
  136.                                 <li class="last">
  137.                                     <span class="work-cat-lis">
  138.                                         <a href="/">2222</a>
  139.                                     </span>
  140.                                 <div class="term-description"></div>
  141.                                 <div class="item-list">
  142.                                 <ul>
  143.                                     <li class="first">
  144.                                     <span class="work-cat-lis">
  145.                                         <a href="/">2222-AA</a>
  146.                                     </span>
  147.                                     <div class="term-description"></div>
  148.                                     <div class="item-list">
  149.                                         <ul>
  150.                                             <li class="first last">
  151.                                               <i id="work-cat-item-241" class="" rel="241">2222-AA-aa</i>
  152.                                               <div class="term-description"> </div>
  153.                                             </li>
  154.                                         </ul>
  155.                                     </div>
  156.                                     </li>
  157.                                     <li class="last">
  158.                                         <span class="work-cat-lis">
  159.                                         <a href="/">2222-BB</a>
  160.                                     </span>
  161.                                     <div class="term-description"></div>
  162.                                     <div class="item-list">
  163.                                         <ul>
  164.                                             <li class="first">
  165.                                                 <i id="work-cat-item-243" class="" rel="243">2222-BB-aa</i>
  166.                                                 <div class="term-description"> (...)</div>
  167.                                             </li>
  168.                                             <li class="last">
  169.                                                 <i id="work-cat-item-242" class="" rel="242">2222-BB-bb</i>
  170.                                                 <div class="term-description"> (...)</div>
  171.                                             </li>
  172.                                         </ul>
  173.                                     </div>
  174.                                     </li>
  175.                                 </ul>
  176.                                 </div>
  177.                             </li>
  178.                         </ul>
  179.                     </div>
  180.                 </li>
  181.          
  182.             </ul>
  183.         </div>
  184.     </div>
  185. </div>


Для него есть небольшой скрипт, по свертыванию и развертыванию элементов в jquery:

CODE (htmlphp):
скопировать код в буфер обмена
  1. (function ($) {
  2.   Drupal.behaviors.fortePopup = {
  3.     attach: function(){
  4.  
  5. // расхлопывающиеся термины-родители словаря
  6.     $('#work-cat-select-wrapper div.item-list').each(function(n){
  7.          if(n==0){
  8.             $(this).addClass('ul'+n);
  9.          }
  10.     });
  11.     $('#work-cat-select-wrapper .ul0').addClass('tree');
  12.     $('.tree').showTree({closeFolders: false, classTree:'classic'});
  13. //--------------------------------------------------------
  14.  
  15.     }
  16.   }
  17.   // расхлопывающиеся термины-родители словаря
  18.         $.fn.showTree = function(o){
  19.                 var o = $.extend({
  20.                         closeFolders: false, // по умолчанию список раскрыт целиком
  21.                         classTree: null // дополнительный класс для списка
  22.                 }, o);
  23.                 return $(this).each(function(){ // проходим по всем спискам
  24.                         var tree = $(this); // присваиваем переменной tree содержание текущего списка
  25.                         tree.addClass('jquery-tree').children('li:first').prepend('<div class="first"></div>'); // добавляем класс по умолчанию и скрываем верхнюю линию в первом элементе списка
  26.                         tree.children('li:last').addClass('last'); // для последнего элемента в списке добавляем класс last
  27.                         tree.find('div.item-list').each(function(){ // проходим по всем вложенным спискам
  28.                                 $(this).children('li:last').addClass('last'); // для последнего элемента в каждом из них добавляем класс last
  29.                         }).prev('a').addClass('folder'); // добавляем класс folder каждой ссылке, за которой идёт вложенный список
  30.  
  31.                         if (o.classTree) tree.addClass(o.classTree); // если есть пользовательский класс, добавляем его
  32.                         tree.find('a.folder').before('<span class="show"></span>'); // добавляем кнопку показа/скрытия содержимого папки
  33.                         tree.find('span.work-cat-lis').click(openTree); // каждой кнопке по клику на неё ставим функцию openTree
  34.                         if (o.closeFolders) { // если содержимое списков должно быть скрыто
  35.                                 tree.find('div.item-list').hide(); // скрываем его
  36.                         } else {
  37.                                 tree.find('.folder').addClass('open').prev('span').addClass('minus'); // иначе показываем что папки открыты
  38.                         }
  39.                 });
  40.                 function openTree(){ // функция, показывающая/скрывающая содержимое папки
  41.                         var button = $(this); // присваиваем переменной button значение нажатой кнопки
  42.                         var link = button.next(); // находим ссылку
  43.                         var files = link.next('div.item-list'); // находим вложенные файлы
  44.                         if (link.hasClass('open')) { // если папка открыта
  45.                                 files.hide(); // скрываем файлы
  46.                         } else {
  47.                                 files.show(); // иначе показываем
  48.                         }
  49.                         link.toggleClass('open'); // переключаем классы у кнопки и папки
  50.                         button.toggleClass('minus'); // если класса нет, добавляем, иначе - убираем
  51.                         return false;
  52.                 }
  53.         };
  54.  
  55. })(jQuery);


Возникают небольшие проблемы (не сразу отвечает на запросы, только при повторном клике). И когда список по умолчанию свернут, то при нажатии на <i>, то сворачивается весь список. Помогите разобраться.
(Добавление)
я нашла свою ошибку.. если можно, то удалите плиз тему.
 
 Top
Страниц (1): [1]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« JavaScript & VBScript »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
 



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB