JQuery анимация не работает после нажатия ссылки

Question

Я только начинаю с JQuery, и мне это нравится, но у меня есть проблема, с которой я не могу окутать голову.

Я реализовал плагин, который я приобрел, который создает сетку больших пальцев, которую вы можете фильтровать по атрибутам. (пронумерованный класс li)

Кроме того, я написал небольшой фрагмент кода, который расширяет div на клик. Это и прекрасно работает до тех пор, пока используется меню (отфильтровать по атрибутам) Я понимаю, это может показаться немного расплывчатым, пока не увидите, что так вот ссылка: http://media-surfer.nl/test

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

Я действительно за жизнь меня не могу понять это, поэтому любая помощь очень ценится! Спасибо за тонну заранее :)

вот код, который я написал:

<!-- collapse expand jquery --> 
<script type="text/javascript"> 

    $(document).ready(function(){ 

     $(".inhoud").hide(); 
     $(".show_hide").show(); 

     $('.show_hide').click(function(event) { 

      $(".inhoud").parent().animate({ 
       width: '160' 
      }, 500, function() { 
      // Animation complete. 
      }); 

     var $inhoud = $(this).next(".inhoud"); 

     if($inhoud.hasClass("active")) 
     { 
      $(this).parent().animate({ 
       width: '160' 
       }, 500, function() { 
       // Animation complete. 
      }); 
      $inhoud.removeClass("active"); 
     } else { 
      $(this).parent().animate({ 
       width: '769' 
       }, 500, function() { 
       // Animation complete. 
      }); 
      $inhoud.addClass("active"); 
     } 

    }); 

}); 

</script> 
<!-- collapse expand jquery --> 

Answer 1

Тааак .. вы нашли ошибку на странице? : D

Я думаю, что однажды использовал тот же самый плагин для сортировки, и то, что он делает, это создать новую коллекцию элементов (соответствующую критериям сортировки), которая затем анимируется. Мой догадка - это точная причина, по которой он нарушает функцию щелчка, поскольку на готовом документе вы привязываете его к существующим элементам и путем сортировки плагина генерирует новые элементы, которые не имеют привязанного к ним события щелчка. Попробуйте использовать .on(), заменив строку:

$('.show_hide').click(function(event) { 

с

$(document).on('click','.show_hide', function(event) {