Question

我有以下脚本：

它正在根据可见的“li”
请注意这只是剧本的一部分 - 我正在寻找短篇小说 - 写出那些聪明的想法......

你能为此提出任何简写吗？还是更优雅的方式来写呢？任何建议都非常感谢。

    var CoundNumberOfDivs = $('#portfolio-items li:visible').length;

    if( CoundNumberOfDivs <= 4 ) { 
        $('.pagination li a').hide(); 
        return false;
    }
    else if( CoundNumberOfDivs <= 8 ) { 
        $('.pagination li a').hide();
        $('.pagination li a:lt(2)').show(); 

        $('#portfolio-items li').hide();
        $('#portfolio-items li:lt(4)').show();
    }
    else if( CoundNumberOfDivs <= 12 ) { 
        $('.pagination li a').hide();
        $('.pagination li a:lt(3)').show(); 

        $('#portfolio-items li').hide();
        $('#portfolio-items li:lt(4)').show();
    }
    else if( CoundNumberOfDivs <= 16 ) { 
        $('.pagination li a').hide();
        $('.pagination li a:lt(4)').show();

        $('#portfolio-items li').hide();
        $('#portfolio-items li:lt(4)').show(); 
    }
    else if( CoundNumberOfDivs <= 20 ) { 
        $('.pagination li a').hide();
        $('.pagination li a:lt(5)').show();

        $('#portfolio-items li').hide();
        $('#portfolio-items li:lt(4)').show(); 
    }

    else if( CoundNumberOfDivs <= 24 ) { 
        $('.pagination li a').hide();
        $('.pagination li a:lt(6)').show();

        $('#portfolio-items li').hide();
        $('#portfolio-items li:lt(4)').show(); 
    }

    else if( CoundNumberOfDivs <= 28 ) { 
        $('.pagination li a').hide();
        $('.pagination li a:lt(7)').show();

        $('#portfolio-items li').hide();
        $('#portfolio-items li:lt(4)').show(); 
    }

    else if( CoundNumberOfDivs <= 32 ) { 
        $('.pagination li a').hide();
        $('.pagination li a:lt(8)').show();

        $('#portfolio-items li').hide();
        $('#portfolio-items li:lt(4)').show(); 
    }

    else if( CoundNumberOfDivs <= 36 ) { 
        $('.pagination li a').hide();
        $('.pagination li a:lt(9)').show();

        $('#portfolio-items li').hide();
        $('#portfolio-items li:lt(4)').show(); 
    }

Answer 1

这是未经测试的，但它乍一看它会起作用。不是所有else if语句，我只使用一个，并将CoundNumberOfDivs除以4，将其四舍五入，并在选择器的:lt部分中使用它：

var CoundNumberOfDivs = $('#portfolio-items li:visible').length;
$('.pagination li a').hide(); 
if( CoundNumberOfDivs <= 4 ) { 
    return false;
}
else {
    var num = Math.ceil(CoundNumberOfDivs / 4);
    $('.pagination li a:lt(' + num + ')').show(); 
    $('#portfolio-items li').hide();
    $('#portfolio-items li:lt(4)').show();
}

我还将$('.pagination li a').hide();行移到if之外，因为它在if和所有else if中都是重复的。

Answer 2

我不再做太多的jQuery了，但这里是

var CoundNumberOfDivs = $('#portfolio-items li:visible').length;

if( CoundNumberOfDivs <= 4 ) { 
    $('.pagination li a').hide(); 
    return false;
}
else
{
    $('.pagination li a').hide();
    $('.pagination li a:lt(' + Math.round(CountNumberOfDivs/4) + ')').show(); 

    $('#portfolio-items li').hide();
   $('#portfolio-items li:lt(4)').show();
}

Answer 3

试试这个：

var CoundNumberOfDivs = $('#portfolio-items li:visible').length;
var divisor = Math.ceil(CoundNumberOfDivs/4);
$('.pagination li a').hide(); 
if(divisor > 1){
    $('.pagination li a:lt(' + divisor + ')').show();  
    $('#portfolio-items li').hide();         
    $('#portfolio-items li:lt(4)').show(); 
} else{
       return false; 
}

Answer 4

您是否查看了jQuery UI选项卡？ http://jqueryui.com/demos/tabs/

jQuery - 编写脚本更优雅的方式

4 个答案: