Как сделать чтоб это заработало?

91
21 июня 2019, 15:00

Почему вот так работает

$(document).ready(function() { 
  $('.good_arrow').click(function() { 
    $('.fulldisc').slideToggle('slow'); 
 
  }); 
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<div class="good"> 
  <div class="good_wrap"> 
    <div class="good_discription"> 
      <div class="good_logo"> 
        <img src="foto_product/small/cat1.jpg"> 
      </div> 
      <div class="good_country"> 
        <p>Greiner Bio-one (Австрия)</p> 
      </div> 
      <div class="good_article"> 
        <p>455092</p> 
      </div> 
    </div> 
    <div class="good_main"> 
      <div class="good_img"> 
        <img src="foto_products/small/172.jpg?=231798872"> 
      </div> 
      <div class="good_name"> 
        <h3>GDM-92</h3> 
        <h4>Пробирки ваккумные (455092)"VACUETTE" для сыворотки 9 мл 16*100 мм, без резьбы</h4> 
        <p>Диаметр: 0.00</p> 
        <p>Объём (V) барабана: 0.7 см3</p> 
        <p>Размер крошки: 0,9-1,0 мм</p> 
      </div> 
    </div> 
    <div class="good_price"> 
      <div class="good_check"> 
        <img src="images/check.png"> 
      </div> 
      <div class="gprice"> 
        <p>1200<span>р</span></p> 
      </div> 
      <div class="good_delivery"> 
        <p>Доставка за 1-2 дня</p> 
      </div> 
      <div class="addcart"> 
        <div class="add"> 
          <div class="num_good"> 
            <p>1</p> 
          </div> 
          <div class="button_good"> 
            <p>В корзину</p> 
          </div> 
        </div> 
      </div> 
    </div> 
    <div class="good_arrow"><img src="images/arrow_blue.jpg" width="15" height="15"> </div> 
  </div> 
  <div class="fulldisc"> 
    <p>Пробирки ваккумные для забора крови 9 мл 16*100 мм, (без резьбы)</p> 
  </div> 
</div>

А вот так не работает slideToggle??? (Ошибок нет)

$(document).ready(function() { 
  $('.good_arrow').click(function() { 
    $(this).parent().find('.fulldisc').slideToggle('slow'); 
  }); 
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<div class="good"> 
  <div class="good_wrap"> 
    <div class="good_discription"> 
      <div class="good_logo"> 
        <img src="foto_product/small/cat1.jpg"> 
      </div> 
      <div class="good_country"> 
        <p>Greiner Bio-one (Австрия)</p> 
      </div> 
      <div class="good_article"> 
        <p>455092</p> 
      </div> 
    </div> 
    <div class="good_main"> 
      <div class="good_img"> 
        <img src="foto_products/small/172.jpg?=231798872"> 
      </div> 
      <div class="good_name"> 
        <h3>GDM-92</h3> 
        <h4>Пробирки ваккумные (455092)"VACUETTE" для сыворотки 9 мл 16*100 мм, без резьбы</h4> 
        <p>Диаметр: 0.00</p> 
        <p>Объём (V) барабана: 0.7 см3</p> 
        <p>Размер крошки: 0,9-1,0 мм</p> 
      </div> 
    </div> 
    <div class="good_price"> 
      <div class="good_check"> 
        <img src="images/check.png"> 
      </div> 
      <div class="gprice"> 
        <p>1200<span>р</span></p> 
      </div> 
      <div class="good_delivery"> 
        <p>Доставка за 1-2 дня</p> 
      </div> 
      <div class="addcart"> 
        <div class="add"> 
          <div class="num_good"> 
            <p>1</p> 
          </div> 
          <div class="button_good"> 
            <p>В корзину</p> 
          </div> 
        </div> 
      </div> 
    </div> 
    <div class="good_arrow"><img src="images/arrow_blue.jpg" width="15" height="15"> </div> 
  </div> 
  <div class="fulldisc"> 
    <p>Пробирки ваккумные для забора крови 9 мл 16*100 мм, (без резьбы)</p> 
  </div> 
</div>

Answer 1

Потому что у .good_arrow и .fulldisc разные родители. Вам надо подняться на уровень выше. Используете $(this).parents('.good')

$(document).ready(function() { 
  $('.good_arrow').click(function() { 
    $(this).parents('.good').find('.fulldisc').slideToggle('slow'); 
 
  }); 
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<div class="good"> 
  <div class="good_wrap"> 
    <div class="good_discription"> 
      <div class="good_logo"> 
        <img src="foto_product/small/cat1.jpg"> 
      </div> 
      <div class="good_country"> 
        <p>Greiner Bio-one (Австрия)</p> 
      </div> 
      <div class="good_article"> 
        <p>455092</p> 
      </div> 
    </div> 
    <div class="good_main"> 
      <div class="good_img"> 
        <img src="foto_products/small/172.jpg?=231798872"> 
      </div> 
      <div class="good_name"> 
        <h3>GDM-92</h3> 
        <h4>Пробирки ваккумные (455092)"VACUETTE" для сыворотки 9 мл 16*100 мм, без резьбы</h4> 
        <p>Диаметр: 0.00</p> 
        <p>Объём (V) барабана: 0.7 см3</p> 
        <p>Размер крошки: 0,9-1,0 мм</p> 
      </div> 
    </div> 
    <div class="good_price"> 
      <div class="good_check"> 
        <img src="images/check.png"> 
      </div> 
      <div class="gprice"> 
        <p>1200<span>р</span></p> 
      </div> 
      <div class="good_delivery"> 
        <p>Доставка за 1-2 дня</p> 
      </div> 
      <div class="addcart"> 
        <div class="add"> 
          <div class="num_good"> 
            <p>1</p> 
          </div> 
          <div class="button_good"> 
            <p>В корзину</p> 
          </div> 
        </div> 
      </div> 
    </div> 
    <div class="good_arrow">CLICK HERE<img src="images/arrow_blue.jpg" width="15" height="15"> </div> 
  </div> 
  <div class="fulldisc"> 
    <p>Пробирки ваккумные для забора крови 9 мл 16*100 мм, (без резьбы)</p> 
  </div> 
</div>

Answer 2

Вы указываете некорректный путь к элементу. parent() указывает на класс good_wrap, который не является родителем для .fulldisc

$(this).closest('.good').find('.fulldisc').slideToggle();
READ ALSO
Сохранение значения таблицы в массив Javascript [дубликат]
javascript

Сохранение значения таблицы в массив Javascript [дубликат]

На данный вопрос уже ответили:

 122
Синтез речи на Node.js
javascript

Синтез речи на Node.js

Как можно сделать синтез речи(То-есть пишешь текст, а программа этот текст говорит) на node jsЯ нашел один модуль say, но при работе данной программы

 98
Валидация данных JavaScript
javascript

Валидация данных JavaScript

Практикуюсь в JS, решил попробовать написать валидацию и со старта столкнулся с проблемойВот так всё работает, и страница не перезагружается

 109
не могу подать запрос на backend NodeJs
javascript

не могу подать запрос на backend NodeJs

очередной раз, не могу правильно написать запрос, и не могу понять в чем собственно делоВот мой код, и так же приведу скрин ошибки которую...

 97