Jquery의 현재 섹션 가져 오기

Question

JQuery 스크립트가 붙어 있습니다. 구조는 다음과 같습니다.

<section class="slider" id="1"> 
    <section class="photo-home"> 
     <img src="images/media/the_file1.jpg" /> 
    </section>   
    <section class="photo-home"> 
     <img src="images/media/the_file2.jpg" /> 
    </section> 
      <!-- ... etc --> 
</section> 

<section class="controls"> 
    <a name="prev">PREV</a> 
    <a name="next">NEXT</a> 
</section> 

문제는 현재 .photo-home을 선택하는 것입니다. 내가 다른 'id'로 식별하는 '.slider'가 많이 있다는 것을 고려할 때. BTW 현재 .photo-home 섹션에 .current 클래스를 추가하고 있습니다. 문제는 버튼을 활성화/비활성화하는 것입니다 (다음/이전) ... 아무도 어떻게 할 수 있는지 알고 있습니까? 난 당신이 nextAll() 및 prevAll() 기능을 사용하여 더 이상 이미지가 있는지 여부를 확인할 수 있습니다 (주석에서 ) 제대로 이해하면

이

은 JQuery와

<script> 
    $('.slider-photo .photo-home:first-child').addClass('current'); 

    $('.slider-photo a[name="prev"]').click(function() { 
     var id = $(this).parent().parent().parent().find('.slider-photo').attr('id'); 
     var curr = // HERE IS WHERE I AM STUCK :(
      if (curr > 0){ 
       $(this).parent().parent().find('.current').removeClass('current').prev().addClass('current'); 
      } 
    }); 
    $('.slider-photo a[name="next"]').click(function() { 
     var id = $(this).parent().parent().parent().find('.slider-photo').attr('id'); 
     var total = $(this).parent().parent().parent().find('.photo-home').length; 
     var curr = // HERE IS THE PROBLEM! :(
     if (curr <= total){ 
      $(this).parent().parent().find('.current').removeClass('current').next().addClass('current'); 
     } 
    }); 
</script> 

Answer 1

입니다.

당신이 this에서 현재 섹션에 대한 참조를 가정하면, 당신처럼 뭔가를 할 수

if($(this).nextAll(".photo-home").length){ //next photo available 
    $(".controls a[name='next']").prop("disabled",false); 
} 
else{ 
    //next photo not available 
    $(".controls a[name='next']").prop("disabled",true); 
} 
if($(this).prevAll(".photo-home").length){ //prev photo available 
    $(".controls a[name='prev']").prop("disabled",false); 
} 
else{ 
    //prev photo not available 
    $(".controls a[name='prev']").prop("disabled",true); 
} 

업데이트 : 내가 이해 한 것과

, 당신의 코드가해야 뭔가

$('.slider-photo a[name="next"]').click(function() { 
    var $parentSlide= $(this).parent().parent().parent().find('.slider-photo'); // Access the slider element 
    var $curr = $parentSlide.find(".current").parent(".photo-home"); // find the current section 
    if($curr.nextAll(".photo-home").length){ //next photo available 
     $(".controls a[name='next']").prop("disabled",false); 
    } 
    else{ //next photo not available 
     $(".controls a[name='next']").prop("disabled",true); 
    } 
}); 

같은

Answer 2

DOOOOOOOONNNNNNNEEEEEEEE !!!! 여기

는 스크립트입니다

<script> 
    $('.slider-photo .photo-home:first-child').addClass('current'); 

    $('.slider-photo a[name="prev"]').click(function() { 
     var id = $(this).closest('.slider-photo').attr('id'); 
     var idt = '#'+id; 
     var curr = $(idt).find('.current').index(idt+' .photo-home'); 
      if (curr > 0){ 
       $(idt).find('.current').removeClass('current').prev().addClass('current'); 
      } 
    }); 
    $('.slider-photo a[name="next"]').click(function() { 
     var id = $(this).closest('.slider-photo').attr('id'); 
     var idt = '#'+id; 
     var total = $(idt).find('.photo-home').length-1; 
     var curr = $(idt).find('.current').index(idt+' .photo-home'); 
     if (curr < total){ 
      $(idt).find('.current').removeClass('current').next().addClass('current'); 
     } 
    }); 
</script> 

나는 그것이 더 좋을 거라 확신하지만 내가 원하는대로 작동합니다. 감사합니다. 감사합니다.