Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Селектор изменяет и потомков. (https://javascript.ru/forum/jquery/45990-selektor-izmenyaet-i-potomkov.html)

Duda.Ml1986@gmail.com 23.03.2014 20:54
Селектор изменяет и потомков.
 
Есть такой вот код: 
var firstText = $('#nav > li ').has('ul').find('a').html();
$('#nav > li ').has('ul').find('a').html('+ ' + firstText);


Меню структурой: 
<ul id='nav'>
  <li><a>link</a>
       <ul class='sub'>
            <li><a>link</a>
                 <ul class='subsub'>
                    <li><a>link</a></li>
                    <li></li>
                    <li></li>
                    <li></li>
                 </ul>
            </li>
            <li><a>link</a></li>
       </ul>  
  </li>
  <li><a>link</a></li>
  <ul>



Нахожу список по Id и проверяю есть ли у его пунктов вложенные потомки списки, если да то в выбраном пункте нахожу а и в него пихаю +, но почему то этот код пробегает по всему меню и получается:
1. Главная/ + Блог / Контакты
2. + Блог / + Блог / +Блог
3. + Блог / + Блог / +Блог

Возможно я не так понимаю?

рони 23.03.2014 21:09
:-? Duda.Ml1986@gmail.com,
$('#nav > li ').has('ul').find('a').html(любое содержимое) -- находит и меняет все ссылки в элементе li
$('#nav > li ').has('ul').find('a').html(); находит содержимое только первой ссылки

Vlasenko Fedor 23.03.2014 21:34 
jQuery(function () {
        $('#nav>li').has('ul').find('>a').each(function(i, el){
         $(el).html('+ ' + $(el).html());
        });
      });

или
jQuery(function () {
        $('#nav>li').has('ul').find('>a').each(function(){
         $(this).html('+ ' + $(this).html());
        });
      });

а так с подпунктами
jQuery(function () {
        $('#nav li').has('ul').find('>a').each(function(){
         $(this).html('+ ' + $(this).html());
        });
      });

рони 23.03.2014 22:40
Duda.Ml1986@gmail.com,
вариант :write: 
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <style type="text/css">
   li  > ul {
    display: none;
  }
  li{
     list-style-type: none;
     width: 100px;
  }
  a.plus, a.minus{
     cursor: pointer;
  }
  a::before {
     content: "▪ ";
     margin-left: +2px;

    }
  .plus::before {
     content: "+ ";
     margin-left: 0px;
    }
  .minus::before {
     content: "- ";
     margin-left: 0px;
   }
  </style>
</head>

<body>
<ul id='nav'>
  <li><a>link</a>
       <ul class='sub'>
            <li><a>link</a>
                 <ul class='subsub'>
                    <li><a>link</a></li>
                    <li></li>
                    <li></li>
                    <li></li>
                 </ul>
            </li>
            <li><a>link</a></li>
       </ul>
  </li>
  <li><a>link</a></li>
  </ul>
  <script>
$(function () {
      $('a:has(+ul)').click(function (e) {
          $(this).toggleClass('plus minus')
          e.preventDefault();
          e.stopPropagation();
          $('+ul', this).slideToggle();
      }).addClass('plus');
  })
  </script>
</body>
</html>


Часовой пояс GMT +3, время: 17:39.