0

大家好,我在一个表上有一个 slideToggle() 函数,它使用 nextUntil 隐藏带有类标题的 tr 的所有子元素,这很好用。

但是我需要获取所有子 tr 的当前状态,以便确定它的子是隐藏还是可见 slideToggle / nextUntil 函数为所有子 tr 设置了一种显示样式,直到下一个带有标题类的 tr (tr.header) 但不理会 td 元素。

所以我想如果我遍历子元素并检查 prop('nodeName') 我可以确定当前状态,即隐藏或显示 - 但我似乎无法让它工作。

如果您使用 slideToggle 显示或隐藏某些内容,可能有一种更简单的方法来确定单击?计划是使用状态值设置本地存储,以便当用户返回页面时,他们先前关闭或打开的元素保持状态。

$('.header').click(function(){

            $(this).nextUntil('tr.header').slideToggle(300);

            var count = 0;
            $.each($(this).nextUntil('tr.header'),function(){
                
                if($(this).prop('nodeName')  == 'TR' && $(this).is(':visible')){
                     count++;  
                }
                
            })

            console.log(count);

            if (count>0){
                alert('its been opened');
            
            }
            else{

                alert('its been closed');
                
            }

        });
4

1 回答 1

1

这个怎么样

let headerAnimationProcessing, headerState = false;
$('#header').click(function(){
    if( headerAnimationProcessing )
        return;

    headerAnimationProcessing = true;
    const $targets = $(this).nextUntil('tr.header');
    $targets[headerState ? 'slideUp' : 'slideDown' ](400, () => { headerAnimationProcessing = false; });
    headerState = !headerState;
});
于 2020-07-31T14:22:58.543 回答