자바 스크립트 프로토 타입 문제

Question

그래서 나는 기본적인 JavaScript 문제가 있습니다.

<div class='alist'>
   <ul> 
       <li class='group_1'> An Item </li>
       <li class='group_1'> An Item </li>
       <li class='group_2'> An Item </li>
   </ul>
</div>

<div class='alist'>
   <ul> 
       <li class='group_1'> An Item </li>
       <li class='group_1'> An Item </li>
       <li class='group_2'> An Item </li>
   </ul>
</div>


<script>
function toggle_item( num ){
    $$( 'li.group_' + num ).invoke('toggle');
}
</script>

기본적으로, 나는 div를 표시하도록 설정하는 스위퍼를 만들어야합니다.

나는 그것이 시작될 것이라고 생각한다 :

function sweep(){
    $$('div.alist').each( function( s ) {
      ar = s.down().children
    }); 
} 

좋은 튜토리얼에 대한 제안도 환영받을 것입니다.

Answer 1

이와 같은 것이 당신을 시작할 수 있습니다. 아이들을 통해 반복하고 그들이 보이는지 확인해야합니다. 그들 중 누구도 없다면 플래그를 설정하고 루프에서 나누십시오. 플래그가 거짓이면 숨길 필요가 없습니다. div.

function sweep(){
    $$('div.alist').each( function( s ) {
        var shouldHide = true;
        var children = s.down().childElements();
        children.each(function(li) {
            if(li.visible()) {
                shouldHide = false;
                throw $break;
            }
        });

        if(shouldHide) {
            s.hide();
        }
    }); 
} 

Answer 2

당신은 사용할 수 있습니다 고르다() 의 방법 Element 모든 것을 찾으려면 li 자손. 그리고 방법을 실행하십시오 Array.all 각각 li 그리고 모든 반환이 참인지 확인하십시오. 모두가 참으로 반환되면 DIV를 숨 깁니다.

function sweep() {
    // check each div
    $$('div.alist').each(function(element) {
        var listItems = element.select('li');
        // are the list items of this div hidden?
        var listItemsHidden = listItems.all(function(item) {
            return item.visible();
        });
        // hide the div too if so
        if(listIemsHidden) {
            element.hide();
        }
    });
}

이 코드는 테스트되지 않았습니다.

Answer 3

이것은 jQuery 솔루션입니다 (프로토 타입은 비슷해야합니다) :

$('div.alist').css('display', function () {
        return $(this).find('li:visible').length < 1 ? 'none' : '';
    });