Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   поиск классов внутри тега (https://javascript.ru/forum/jquery/39076-poisk-klassov-vnutri-tega.html)

yozuul 14.06.2013 13:15

поиск классов внутри тега
 
помогите дописать скрипт

если внутри тега с классом .main есть тег с классом .main2, то для всех тегов с именами классов .sub расположенных после найденного .main2 и до ближайшего класса .end (их там несколько) задать стиль display:inline

main2list = $('.main').find('.main2');
if (???){
    main2list.find('.sub, .end').each(

      function() {
         if ($(this).hasclass('.sub')) $(this).css('display', 'inline')
         if ($(this).hasclass('.end')) return;

      }
    );
}

ksa 14.06.2013 13:38

yozuul, ты хоть ХТМЛ разметку свою покажи... :D

ksa 14.06.2013 13:39

Цитата:

Сообщение от yozuul
main2list = $('.main').find('.main2');

main2list = $('.main .main2');

devote 14.06.2013 13:47

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="main">
    <div class="main2">1</div>
    <div class="sub">2</div>
    <div class="sub">3</div>
    <div class="end">4</div>
    <div class="sub">5</div>
    <div class="sub">6</div>
    <div class="end">7</div>
</div>
<script>
$('.main .main2 ~ .sub').filter(':not(.end ~ .sub)').css('color', 'red');
</script>

yozuul 14.06.2013 14:18

Цитата:

Сообщение от ksa (Сообщение 256280)
yozuul, ты хоть ХТМЛ разметку свою покажи... :D

многоуровневое меню.

<ul id="main_menu">
  <li class="shme_a"></li>
    <li class="shme_aa"></li>
    <li class="shme_aa"></li>
  <li class="shme_s"></li>
  <li class="shme_a"></li>
</ul>


родительским элементам задается класс .shme_a, всем дочерним, в зависимости от вложенности .shme_aa, shme_aaa и тд.
активным родительским элементам задается класс .shme_s, всем дочерним, в зависимости от вложенности .shme_ss, shme_sss и тд.

Нужно скрывать и раскрывать меню в зависимости от выбранных элементов. по умолчанию все дочерние теги скрыты

devote,
красиво)
все работает так как и спрашивал, но к моему примеру все равно не подходит.

не пойму как это реализовать.

ksa 14.06.2013 14:27

Цитата:

Сообщение от yozuul
многоуровневое меню

Но там нет такого
Цитата:

Сообщение от yozuul
внутри тега с классом .main есть тег с классом .main2, то для всех тегов с именами классов .sub расположенных после найденного .main2 и до ближайшего класса .end


ksa 14.06.2013 14:28

Цитата:

Сообщение от yozuul
но к моему примеру все равно не подходит

:lol:
Так ты сделай нормальный пример... Нормально задай вопрос по твоему же примеру...
Оно гляди и прояснится! ;)

danik.js 14.06.2013 14:29

Цитата:

Сообщение от yozuul
многоуровневое меню.

Вот многоуровневое меню:
<ul id="main_menu">
  <li class="shme_a">
      <ul>
        <li class="shme_aa"></li>
        <li class="shme_aa"></li>
      </ul>
  </li>
  <li class="shme_s"></li>
  <li class="shme_a"></li>
</ul>


А у тебя один уровень.

yozuul 14.06.2013 14:31

Цитата:

Сообщение от ksa (Сообщение 256301)
:lol:
Так ты сделай нормальный пример...

тогда вот так:
многоуровневое меню.

<ul id="main_menu">
  <li class="shme_a"></li>
    <li class="shme_aa"></li>
    <li class="shme_aa"></li>
  <li class="shme_s"></li>
  <li class="shme_a"></li>
</ul>


родительским элементам задается класс .shme_a, всем дочерним, в зависимости от вложенности .shme_aa, shme_aaa и тд.
активным родительским элементам задается класс .shme_s, всем дочерним, в зависимости от вложенности .shme_ss, shme_sss и тд.

Нужно скрывать и раскрывать меню в зависимости от выбранных элементов.

1. Если внутри #main_menu в .li не встречается буква 's', то css для .li с именами классов с кол-вом букв 'а' > 1 - стиль display:none //если ни один из родительских элементов не выбран - скрываем все дочерние

2. Если внутри #main_menu в .li встречается одна буква 's', то css для .li с именами классов с кол-вом букв 'а' > 2, и .li c именами классов с кол-вом букв 'a' > 1, раположенных перед найденным .li с буквой 's' и после ближайшего .li с кол-вом букв 'a'=1 - стиль display:none //если выбран любой родительский, то раскрываем его второй уровень, и скрываем все дочерние др. родительских и скрываем дочерние 3 и более уровней текущего

3. Если внутри #main_menu в .li встречается две буквы 's', то css для .li с именами классов с кол-вом букв 'а' > 1, расположенных перед найденным 's' и после ближайшего 'a'< 3 - стиль display:none //если выбран третий уровень меню, скрываем все меню 2 и 3 уровня др. родительских.

yozuul 14.06.2013 14:32

Цитата:

Сообщение от danik.js (Сообщение 256302)
А у тебя один уровень.

кусок показан

yozuul 14.06.2013 14:34

но сдается мне - это все танцы с бубном

ksa 14.06.2013 14:52

Цитата:

Сообщение от yozuul
родительским элементам задается класс .shme_a, всем дочерним, в зависимости от вложенности .shme_aa, shme_aaa и тд.
активным родительским элементам задается класс .shme_s, всем дочерним, в зависимости от вложенности .shme_ss, shme_sss и тд.

Нужно скрывать и раскрывать меню в зависимости от выбранных элементов.

1. Если внутри #main_menu в .li не встречается буква 's', то css для .li с именами классов с кол-вом букв 'а' > 1 - стиль display:none //если ни один из родительских элементов не выбран - скрываем все дочерние

2. Если внутри #main_menu в .li встречается одна буква 's', то css для .li с именами классов с кол-вом букв 'а' > 2, и .li c именами классов с кол-вом букв 'a' > 1, раположенных перед найденным .li с буквой 's' и после ближайшего .li с кол-вом букв 'a'=1 - стиль display:none //если выбран любой родительский, то раскрываем его второй уровень, и скрываем все дочерние др. родительских и скрываем дочерние 3 и более уровней текущего

3. Если внутри #main_menu в .li встречается две буквы 's', то css для .li с именами классов с кол-вом букв 'а' > 1, расположенных перед найденным 's' и после ближайшего 'a'< 3 - стиль display:none //если выбран третий уровень меню, скрываем все меню 2 и 3 уровня др. родительских.

Здается мне у тебя какое-то извращенное представление о многоуровневых списках... :)

ksa 14.06.2013 14:54

Цитата:

Сообщение от yozuul (Сообщение 256303)
тогда вот так:
многоуровневое меню.

<ul id="main_menu">
  <li class="shme_a"></li>
    <li class="shme_aa"></li>
    <li class="shme_aa"></li>
  <li class="shme_s"></li>
  <li class="shme_a"></li>
</ul>

И это не многоуровневое меню... :lol:

ksa 14.06.2013 14:55

Вот тут действительно многоуровневое меню...
http://xandeadx.ru/blog/javascript/5

yozuul 14.06.2013 15:01

и в чем же разница? в том что подразделы заключены в еще одни теги <ul>?

<ul id="main_menu">
  <li class="shme_a">Раздел 1</li>
    <li class="shme_aa">Подраздел 1</li>
    <li class="shme_aa">Подраздел 2</li>
  <li class="shme_s">Раздел 2</li>
  <li class="shme_a">Раздел 3</li>
</ul>


так понятнее будет?

devote 14.06.2013 15:05

Цитата:

Сообщение от yozuul
и в чем же разница? в том что подразделы заключены в еще одни теги <ul>?

в том что все ваши теги LI имеют одного родителя UL от того это и считается один уровень вложенности. А значит и один уровень меню.

ksa 14.06.2013 15:14

Цитата:

Сообщение от yozuul
в том что подразделы заключены в еще одни теги <ul>?

А это, в твоем понимании, мелочь? :blink:

Цитата:

Сообщение от yozuul
так понятнее будет?

Это как было неправильно - так таковым и осталось.

yozuul 14.06.2013 15:21

так или иначе, меню отражает реальную иерархию сайта, где категории вложены одна в другую. меню формируется движком, я его руками не прописываю.
<ul class="menu_m_s">
<li class="shme_s"><a href="/shop/cat/" alt="Кошки">Товары для кошек</a></li>
	<li class="shme_aa"><a href="/shop/cat/cats_fav_food/" alt="Лакомства для кошек">Лакомства для кошек</a></li>
	<li class="shme_aa"><a href="/shop/cat/c_korm/" alt="Корма">Корма</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/bozita/" alt="Бозита">Бозита</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/brit/" alt="Брит">Брит</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/yams/" alt="Ямс">Ямс</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/eucanuba/" alt="Эукануба">Эукануба</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/hills/" alt="Хиллс">Хиллс</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/friskies/" alt="Фрискис">Фрискис</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/kitekat/" alt="Китикет">Китикет</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/perfect-fit/" alt="Перфект Фит">Перфект Фит</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/royal-canin/" alt="Роял Канин">Роял Канин</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/whiskas/" alt="Whiskas">Вискас</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/chetveronogiy-gurman/" alt="Четвероногий Гурман">Четвероногий Гурман</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/other-cat/" alt="Другие корма для кошек">Другие корма для кошек</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_korm/new_cats_food/" alt="Новый корм">Новый корм</a></li>
	<li class="shme_aa"><a href="/shop/cat/c_kosm/" alt="Косметика и уход">Косметика и уход</a></li>
	<li class="shme_aa"><a href="/shop/cat/c_gig/" alt="Гигиена">Гигиена</a></li>
	<li class="shme_aa"><a href="/shop/cat/c_acss/" alt="Аксессуары">Аксессуары</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_acss/bed/" alt="Лежаки">Лежаки</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_acss/collar/" alt="Поводки, шлейки, ошейники">Поводки, шлейки, ошейники</a></li>
		<li class="shme_aaa"><a href="/shop/cat/c_acss/toys/" alt="Игрушки">Игрушки</a></li>
	<li class="shme_aa"><a href="/shop/cat/c_odejda/" alt="Одежда">Одежда</a></li>

<li class="shme_a"><a href="/shop/dog/" alt="Собаки">Товары для собак</a></li>
	<li class="shme_aa"><a href="/shop/dog/dog-food/" alt="Корма для собак">Корма</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog-food/hills-dog/" alt="Хиллс">Хиллс</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog-food/brit-d/" alt="Брит">Брит</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog-food/chappi-d/" alt="Чаппи">Чаппи</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog-food/eukanuba-d/" alt="Эукануба">Эукануба</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog-food/pedigree-d/" alt="Педигри">Педигри</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog-food/pro-pac-d/" alt="Про Пак">Про Пак</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog-food/d-royal-canin/" alt="Роял Канин для собак">Роял Канин</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog-food/4-gurman-d/" alt="Четвероногий гурман">Четвероногий гурман</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog-food/other-d/" alt="Другие корма для собак">Другие корма для собак</a></li>
	<li class="shme_aa"><a href="/shop/dog/dog_fav_food/" alt="Лакомства для собак">Лакомства для собак</a></li>
	<li class="shme_aa"><a href="/shop/dog/dog_cosm/" alt="Косметика и уход для собак">Косметика и уход для собак</a></li>
	<li class="shme_aa"><a href="/shop/dog/dog_gigiena/" alt="Гигиена для собак">Гигиена для собак</a></li>
    <li class="shme_aa"><a href="/shop/dog/dog_acss/" alt="Аксессуары для собак">Аксессуары для собак</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog_acss/toys-d/" alt="Игрушки для собак">Игрушки для собак</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog_acss/bed-d/" alt="Лежаки для собак">Лежаки для собак</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog_acss/bowl-d/" alt="Посуда">Посуда</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog_acss/brush-d/" alt="Щетки, расчёски">Щетки, расчёски</a></li>
		<li class="shme_aaa"><a href="/shop/dog/dog_acss/collar-d/" alt="Поводки, шлейки, ошейники для собак">Поводки, шлейки, ошейники для собак</a></li>
    <li class="shme_aa"><a href="/shop/dog/dog_cl/" alt="Одежда для собак">Одежда для собак</a></li>

<li class="shme_a"><a href="/shop/bird/" alt="Птицы">Товары для птиц</a></li>
	<li class="shme_aa"><a href="/shop/bird/bird_food/" alt="Корма для птиц">Корма для птиц</a></li>
    <li class="shme_aa"><a href="/shop/bird/bird_fav/" alt="Лакомства для птиц">Лакомства для птиц</a></li>
    <li class="shme_aa"><a href="/shop/bird/bird_kletki/" alt="Клетки для птиц">Клетки для птиц</a></li>
    <li class="shme_aa"><a href="/shop/bird/bird_acss/" alt="Аксессуары для птиц">Аксессуары для птиц</a></li>

<li class="shme_a"><a href="/shop/rodent/" alt="Грызуны">Товары для грызунов</a></li>
	<li class="shme_aa"><a href="/shop/rodent/rodent_food/" alt="Корма для грызунов">Корма для грызунов</a></li>
	<li class="shme_aa"><a href="/shop/rodent/rodent_fav/" alt="Лакомства для грызунов">Лакомства для грызунов</a></li>
	<li class="shme_aa"><a href="/shop/rodent/rodent_kletki/" alt="Клетки для грызунов">Клетки для грызунов</a></li>
    <li class="shme_aa"><a href="/shop/rodent/rodent_acss/" alt="Аксессуары для грызунов">Аксессуары для грызунов</a></li>

<li class="shme_a"><a href="/shop/fish/" alt="Рыбки">Товары для рыбок</a></li>
	<li class="shme_aa"><a href="/shop/fish/fish_food/" alt="Корма для рыбок">Корма для рыбок</a></li>
    <li class="shme_aa"><a href="/shop/fish/fish_acss/" alt="Аксессуары для рыбок">Аксессуары для рыбок</a></li>
    <li class="shme_aa"><a href="/shop/fish/fish_obor/" alt="Оборудование для рыбок">Оборудование для рыбок</a></li>

<li class="shme_a"><a href="/shop/horse/" alt="Лошади">Товары для лошадей</a></li>
    <li class="shme_aa"><a href="/shop/horse/horse_cosm/" alt="Косметика и уход для лошадей">Косметика и уход для лошадей</a></li>
    <li class="shme_aa"><a href="/shop/horse/horse_acss/" alt="Аксессуары для лошадей">Аксессуары для лошадей</a></li>

<li class="shme_a"><a href="/shop/reptile/" alt="Рептилии">Товары для рептилий</a></li>
	<li class="shme_aa"><a href="/shop/reptile/reptile_food/" alt="Корма для рептилий">Корма для рептилий</a></li>
    <li class="shme_aa"><a href="/shop/reptile/reptile_acss/" alt="Аксессуары для рептилий">Аксессуары для рептилий</a></li>
    <li class="shme_aa"><a href="/shop/reptile/reptile_obor/" alt="Оборудование для рептилий">Оборудование для рептилий</a></li>

<li class="shme_a"><a href="/shop/ferrets/" alt="Хорьки">Товары для хорьков</a></li>
	<li class="shme_aa"><a href="/shop/ferrets/ferrets_food/" alt="Корма для хорьков">Корма для хорьков</a></li>
    <li class="shme_aa"><a href="/shop/ferrets/ferrets_cosm/" alt="Косметика и уход для хорьков">Косметика и уход для хорьков</a></li>
    <li class="shme_aa"><a href="/shop/ferrets/ferrets_acss/" alt="Аксессуары для хорьков">Аксессуары для хорьков</a></li>

<li class="shme_a"><a href="/shop/company/" alt="Производители">Производители</a></li>
	<li class="shme_aa"><a href="/shop/company/bozita_pr/" alt="Бозита">Бозита</a></li>
    <li class="shme_aa"><a href="/shop/company/brit-pr/" alt="Брит">Брит</a></li>
    <li class="shme_aa"><a href="/shop/company/doktor-klauder-pr/" alt="Доктор Клаудер">Доктор Клаудер</a></li>
    <li class="shme_aa"><a href="/shop/company/eukanuba-pr/" alt="Эукануба">Эукануба</a></li>
    <li class="shme_aa"><a href="/shop/company/hills-pr/" alt="Хиллс">Хиллс</a></li>
    <li class="shme_aa"><a href="/shop/company/friskis-pr/" alt="Фрискис">Фрискис</a></li>
    <li class="shme_aa"><a href="/shop/company/kitiket-pr/" alt="Китикет">Китикет</a></li>
    <li class="shme_aa"><a href="/shop/company/perfekt-fit-pr/" alt="Перфект Фит">Перфект Фит</a></li>
    <li class="shme_aa"><a href="/shop/company/royal-kanin-pr/" alt="Роял Канин">Роял Канин</a></li>
    <li class="shme_aa"><a href="/shop/company/wiskas-pr/" alt="Вискас">Вискас</a></li>
    <li class="shme_aa"><a href="/shop/company/4-gurman-pr/" alt="Четвероногий Гурман">Четвероногий Гурман</a></li>
    <li class="shme_aa"><a href="/shop/company/chappi-pr/" alt="Чаппи">Чаппи</a></li>
    <li class="shme_aa"><a href="/shop/company/pedigree-pr/" alt="Педигри">Педигри</a></li>
    <li class="shme_aa"><a href="/shop/company/pro-pak-pr/" alt="Про Пак">Про Пак</a></li>
</ul>

хорошо. пусть будет одноуровневое. что изменится от этого?

Faab 14.06.2013 15:46

Да пойми ты.. от того что ты постаил пару пробелов (или таб) перед <li> - ещё не значит что образовал новый уровень. У тебя сейчас тупо большой одноуровний список с одним классом.

ksa 14.06.2013 15:56

Цитата:

Сообщение от yozuul
так или иначе, меню отражает реальную иерархию сайта

Ну, ну... :D

Цитата:

Сообщение от yozuul
хорошо. пусть будет одноуровневое. что изменится от этого?

Гемор ты себе нажил, а так более ничего... :D

yozuul 14.06.2013 16:03

Цитата:

Сообщение от ksa (Сообщение 256341)
Ну, ну... :D

ну что ну-ну?

Цитата:

Сообщение от ksa (Сообщение 256341)
Гемор ты себе нажил, а так более ничего... :D

это я давно уже понял :)

yozuul 14.06.2013 16:04

Цитата:

Сообщение от Faab (Сообщение 256339)
Да пойми ты.. от того что ты постаил пару пробелов

я их поставил, чтобы было понятно как все это выглядит наглядно - где какая вложенность.

devote 14.06.2013 16:46

Цитата:

Сообщение от Faab
сейчас тупо большой одноуровний список с одним классом.

с другой стороны конечно и из этого можно сделать многоуровневое меню...
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<style>
    .shme_aa, .shme_aaa {
        display: none;
    }
</style>
<ul class="menu_m_s">
<li class="shme_a"><a href="/shop/cat/" alt="Кошки">Товары для кошек</a></li>
    <li class="shme_aa"><a href="/shop/cat/cats_fav_food/" alt="Лакомства для кошек">Лакомства для кошек</a></li>
    <li class="shme_aa"><a href="/shop/cat/c_korm/" alt="Корма">Корма</a></li>
        <li class="shme_aaa"><a href="/shop/cat/c_korm/bozita/" alt="Бозита">Бозита</a></li>
<li class="shme_a"><a href="/shop/dog/" alt="Собаки">Товары для собак</a></li>
    <li class="shme_aa"><a href="/shop/dog/dog-food/" alt="Корма для собак">Корма</a></li>
        <li class="shme_aaa"><a href="/shop/dog/dog-food/hills-dog/" alt="Хиллс">Хиллс</a></li>
        <li class="shme_aaa"><a href="/shop/dog/dog-food/brit-d/" alt="Брит">Брит</a></li>
</ul>

<script type="text/javascript">
$(function() {
    $('.shme_a a').click(function(e) {
        var keep = false;
        $(this).parent().find('~ .shme_a, ~ li.shme_aa').filter(function() {
            return !(keep = !keep ? $(this).hasClass('shme_a') : 1);
        }).slideToggle();
        e.preventDefault();
    });

    $('.shme_aa a').click(function(e) {
        var keep = false;
        $(this).parent().find('~ .shme_aa, ~ li.shme_aaa').filter(function() {
            return !(keep = !keep ? $(this).hasClass('shme_aa') : 1);
        }).slideToggle();
        e.preventDefault();
    });
});
</script>
Тока нафига так извращаться то???

yozuul 14.06.2013 17:31

Цитата:

Сообщение от devote (Сообщение 256354)
с другой стороны конечно и из этого можно сделать многоуровневое меню...

Оно! Только не осуществляется переход при клике на ссылках в тегах .shme_aa, если у них нет "вложений", и если развернуто меню "третьего уровня" (.shme_aaa), то при попытке свернуть основную .shme_a, он сворачивает только .shme_aa которые ей принадлежат. И еще бы сделать, чтобы при переходе на новую страницу, то что было развернуто, так и оставалось развернутым.

Цитата:

Сообщение от devote (Сообщение 256354)
Тока нафига так извращаться то???

я же говорю, это модуль в движке мне такую структуру формирует.

danik.js 14.06.2013 22:00

Цитата:

Сообщение от yozuul
я же говорю, это модуль в движке мне такую структуру формирует.

Выкинь нахер этот движок. Или хотя бы отрежь разработчику яйца.
Нынче любой паршивый двиг может сгенерировать нормальный многоуровневый список.


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