Скрыть кнопку «next» на последнем элементе

Question

У меня есть несколько div, которые посетители могут перелистывать кнопками «предыдущий» и «следующий». Это код, который я написал, что работает отлично:

$("#next").click(function(){ 
    $(".open").removeClass("open").fadeOut(200, function(){ // remove .open from current opened detail and fade out 
     $(this).next(".outsourcing").addClass("open").fadeIn(400); // add .open to next detail and fade in 
     if ($(".open").hasClass(".item<?php echo $outsourcing_count-1; ?>")) { 
      $("#next").hide(); 
     } 
    }) 
}); 

На последнем пункте, я хотел бы, чтобы скрыть кнопку «Далее». Последний элемент не является последним дочерним элементом в содержащем div, поэтому я использовал PHP, чтобы пометить его специальным классом, как вы можете видеть в приведенном выше примере if. Но утверждение if, похоже, не стреляет, никаких мыслей? Благодаря!

Answer 1

удалить "." перед тем пункт .. вы не должны давать идентификатор класса при использовании hasClass

if ($(".open").hasClass("item<?php echo $outsourcing_count-1; ?>")) { 
      $("#next").hide(); 
     } 

Answer 2

Вам не нужно использовать PHP впрыскивается значение, чтобы проверить, если это последний элемент

if ($(".open").is(':last-child')) 
{ 
     // must be the last item 
} 

будет делать, или (если это не последний ребенок в этом контейнере) просто проверить, есть ли next пункт:

if (!$(".open").next(".outsourcing").length) 
{ 
     // must be the last item 
} 

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