0

Подскажите пожалуйста, как я могу оптимизировать такой код? Знаю, что как-то можно не писать кучу классов и id, а использовать переменную this. Однако, когда я попробовал через нее сделать, то у меня по нажатию на любое место срабатывает функция или просто тот элемент, по которому нажимал, закрывался. Ccылка на кодпен https://codepen.io/Misha_mishy/pen/abzRwrO?editors=1111

$(document).ready(function(){

    $( ".slideToggle-2" ).click(function(){        
      $(".toggle__content-2").slideToggle(); 
    });

    $( ".slideToggle-3" ).click(function(){        
      $(".toggle__content-3").slideToggle(); 
    });

    $( ".slideToggle-3" ).click(function(){
      $(".toggle__content-3").slideToggle(); 
    });

    $( ".slideToggle-4" ).click(function(){        
      $(".toggle__content-4").slideToggle(); 
    });

1 ответ 1

2

$('[class^=slideToggle]').on('click',function(){
    $(this).prev('[class^=toggle__content]').slideToggle();
});
.toggle__content-2,
.toggle__content-3,
.toggle__content-4{
  display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p class="toggle__content-2"> какой-то текст</p>
 <div class="slideToggle-2">Показать текст </div>

<p class="toggle__content-3"> какой-то текст</p>
 <div class="slideToggle-3">Показать текст </div>

<p class="toggle__content-4"> какой-то текст</p>
 <div class="slideToggle-4">Показать текст </div>

1

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.