Добавить +/- в меню js

ЕСТЬ РЕШЕНИЕ ЗАКРЫТО
#1 15 февраля 2017 в 11:14
Доброго времени суток!

Горожу тут одно дело, которое вывожу в виде вертикального многоуровневого меню.
Все работает, открывается/закрывается, но хотелось бы добавить + к пунктам которые имеют подпункты, а с явой я как то не подружился (хотя я мало с чем подружился)

Код:
  1. <script>
  2. $(document).ready(function()
  3. {
  4. $('#menu ul').css({'display':'none'});
  5. $('#menu a').on('click',function(event)
  6. {
  7. var ul = $(this).next('ul');
  8. $(ul).slideToggle('400');
  9.  
  10. });
  11. });
  12. </script>
Спасибо!
#2 15 февраля 2017 в 12:17
Может подсмотреть, как у Олега Василича сделано?
instantcms.ru/blogs/esli-dolgo-muchitsja/akordeon-iz-vidzhetov.html

У него там и сворачивается и разворачивается. И плюсы и минусы есть.
#3 15 февраля 2017 в 12:38
Та надо еще бы как то класс добавлять, приведу полностью весь код (он найден в интернете, и немного допилен мной)

  1.  
  2. <!DOCTYPE html>
  3. <html>
  4. <head>
  5. <style>
  6. *{margin:0px;padding:0px;}
  7. html,body{height:100%;}
  8. #menu{display:block;width:200px;}
  9.  
  10. #menu ul{display:block;padding-left:20px;list-style-type:none;}
  11. #menu a{cursor:pointer;}
  12.  
  13. </style>
  14. <script type="text/javascript" src="/min.js"></script>
  15. <script>
  16. $(document).ready(function()
  17. {
  18. $('#menu ul').css({'display':'none'});
  19. $('#menu a').on('click',function(event)
  20. {
  21. var ul = $(this).next('ul');
  22. $(ul).slideToggle('400');
  23.  
  24. });
  25. });
  26. </script>
  27.  
  28. </head>
  29. <body>
  30.  
  31. <?php
  32. header( 'Content-Type: text/html; charset=utf-8' );
  33. $link = mysql_connect("host", "user", "pass") or die(mysql_error());
  34. mysql_select_db("db", $link) or die(mysql_error());
  35. mysql_query("SET NAMES utf8");
  36. //Выбираем данные из БД
  37. $result=mysql_query("SELECT * FROM affiliate");
  38. //Если в базе данных есть записи, формируем массив
  39. if (mysql_num_rows($result) > 0){
  40. $cats = array();
  41. //В цикле формируем массив разделов, ключом будет id родительской категории, а также массив разделов, ключом будет id категории
  42. while($cat = mysql_fetch_assoc($result)){
  43. $cats_ID[$cat['affiliate_id']][] = $cat;
  44. $cats[$cat['parent']][$cat['affiliate_id']] = $cat;
  45. }
  46. }
  47.  
  48.  
  49. function build_tree($cats,$parent,$only_parent = false){
  50. if(is_array($cats) and isset($cats[$parent])){
  51. $tree = '<ul id="menu">';
  52. if($only_parent==false){
  53. foreach($cats[$parent] as $cat){
  54. $tree .= '<li><a href="#">'.$cat['firstname'].' '.$cat['lastname'];
  55. $tree .= build_tree($cats,$cat['affiliate_id']);
  56. $tree .= '</li>';
  57. }
  58. }elseif(is_numeric($only_parent)){
  59. $cat = $cats[$parent][$only_parent];
  60. $tree .= '<li><a href="#">'.$cat['firstname'].' #'.$cat['lastname'];
  61. $tree .= build_tree($cats,$cat['affiliate_id']);
  62. $tree .= '</li>';
  63. }
  64. $tree .= '</ul>';
  65. }
  66. else return null;
  67. return $tree;
  68. }
  69.  
  70. echo build_tree($cats,0);
  71. ?>
  72. </body>
  73. </html>
  74.  
  75.  
  76.  
#4 15 февраля 2017 в 13:50
Просто +, или подпункты будут открываться по клику?
Добавляешь картинку. Это, как я понял родитель?
  1. foreach($cats[$parent] as $cat){
  2. $tree .='<li>';if("Здесь условие"){ $tree .='<img class="img" src="" /> ';} $tree .='<a href="#">'.$cat['firstname'].' '.$cat['lastname'];
  3. $tree .= build_tree($cats,$cat['affiliate_id']);
  4. $tree .= '</li>';
  5. }
С условием думаю понятно. А потом на класс картинки вешаешь onclick и по нему прячешь или открываешь дочернии.
#5 15 февраля 2017 в 14:07
Lora, Сейчас подпункты открываются по клику (каждый пункт как ссылка, при клике на которую открываються дочерние если они есть), но хотелось бы обозначить пункты которые имеют подпункты, потому как часть пунктов не имеет вложенных.

Или хотя бы присвоить класс для пунктов с вложеностью
#6 15 февраля 2017 в 14:14
Ну а я о чём? Если открываются, значит не вешай клик, а просто условие пропиши для пункта. Уровни вложенности в таблице есть? Если есть, то от них и отталкивайся. Если нет, то ничего у тебя не выйдет.
#7 15 февраля 2017 в 14:18
  1. $('#menu li ul').parent('li').addClass('folder');
#8 15 февраля 2017 в 14:21
Великое в простом.
#9 15 февраля 2017 в 14:24
Lora, таблица такого вида:
id | name | parent |
------------------------------------
| 1 | вася | 0 |
| 2 | петя | 1 |
| 3 | степа | 0 |
| 4 | игорь | 1 |
| 5 | кеша | 2 |
#10 15 февраля 2017 в 14:29
r2, Спасибо=) Работает!
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.