jQuery_jquery에서 $(this).index 및 $.each 사용 안내

작업의 특정 요구 사항에 따라 탭 전환 효과는 각 옵션 아래의 총 콘텐츠 요소 수에 따라 HTML을 다르게 변경하는 것입니다(탭 아래의 콘텐츠가 비어 있으면 XXX이고, 그렇지 않으면 XXX와 같음 )

코드 복사 코드는 다음과 같습니다.

$(함수(){
           $(".bao").hide();
             $(".bao").eq(0).show();
              $(".head li").click(function(){
                  $(this).addClass('cur').siblings().removeClass("cur");
$(".bao").eq($(this).index()).show().siblings(".bao").hide()
               var a=$(".bao").eq($(this).index()).find('li')
If(a.length warning("나는 0보다 작습니다!!")
              }
           });
            기능 moren(){
            var moren=$(".moren").find('li')
If(moren.length==0){
Alert("나는 비어있습니다~ 기회가 없습니다")
              }
          }
})

먼저 탭의 헤더를 헤더라고 선언합니다

탭의 내용을 콘텐츠라고 합니다~

가장 먼저 떠오르는 방법(멍청한 방법) :

바인딩은 클릭 이벤트를 추가합니다. 헤더 전환 시 실행됩니다. 헤더는 자체 인덱스에 따라 해당 콘텐츠를 가져옵니다. 콘텐츠 아래의 li 요소를 탐색한 후 각 헤더에 해당하는 콘텐츠 아래의 전체 개수를 가져옵니다.

클릭 이벤트 이후에 발견된 내용인데 헤드의 첫 번째 요소가 무시되었기 때문에 브라우저 새로고침 시 실행을 시작하길 원해서 헤드의 첫 번째 요소에 더 많은 요소를 추가했다고 판단합니다. 이 수업 수업. 드디어~

내가 원하는 효과만 얻으세요. number==0||!==0이면 내가 원하는 것이 실행됩니다.

하지만 생각해 보세요. 나중에 예상치 못한 일이 발생할 수 있습니다. 클릭할 때 브라우저가 새로 고쳐지고 로드되는 것을 원하지 않습니다. 그래서 저는 초보자인데 방법을 찾기 위해 열심히 노력했습니다

오히려 이게 더 좋은 것 같아요~:

코드 복사 코드는 다음과 같습니다.

$(함수(){
            $(".bao").hide();
              $(".bao").eq(0).show();
              $(".head li").click(function(){
$(this).addClass('cur').siblings().removeClass("cur");
$(".bao").eq($(this).index()).show().siblings(".bao").hide()
           });
        var aaa= $(".bao ul")
aaa.each(함수(){
            var b=$(this).children('li').length
경고(b)
If(b==0){
                           $(this).append("

0

다음에 추가되었습니다.")
            }
})
})

이 메소드는 $.each()를 사용합니다

더 편리해서 지금까지 원하는 결과를 얻고 있습니다. $.each()는 각 콘텐츠 요소를 순회한 다음 콘텐츠 자체 아래에 있는 li 요소의 총 개수를 가져온 다음 내가 원하는 효과를 판단하고 얻을 수 있습니다