.first（'li）选择列表中的第一项不起作用

Question

希望您能提供帮助，此代码无法正常工作。 它可以选择下一个图像，但是如果它在最后一个图像上并且没有“下一个图像”，那么我想在“ li”中选择第一个图像。 我添加了一个if条件：if（nextLi.value！==''）...但这似乎不起作用。

    function nextImg(){         
    $('#background').find('img').animate({'opacity': 0}, 500, function (){
        var nextLi = $('.sel').parent().parent().next('li').find('a');

        if (nextLi.value !=='') {
            var nextLiA = nextLi.attr('rel');
            $('#background').find('img').attr({'src':nextLiA});
            $('.sel').appendTo(nextLi); 
        } else {
            var nextLi = $('.sel').parent().parent().first('li').find('a');
            var nextLiA = nextLi.attr('rel');
            $('#background').find('img').attr({'src':nextLiA});
            $('.sel').appendTo(nextLi); 
        }
    });
}

Answer 1

您应该改用length ，请执行以下操作：

if (!nextLi.length){
//do stuff
}

如果选择为空，则nextLi.length将返回0（即false ），因此您添加了!

Answer 2

nextLi是一个jQuery对象。 如果要查看它是否包含任何元素，即是否有任何与您使用的选择器匹配的元素，则只需检查其.length属性即可：

if (nextLi.length > 0 ) {

还要注意，if块中的三行与else的最后三行相同，因此可以如下简化代码：

    if (nextLi.length === 0) {
        nextLi = $('.sel').parent().parent().first('li').find('a');
    }
    $('#background').find('img').attr({'src': nextLi.attr('rel') });
    $('.sel').appendTo(nextLi); 

（由于仅在一个地方使用了nextLia变量，因此我已将其完全删除-您可以在设置src属性时直接使用nextLi.attr('rel') 。）

Answer 3

尝试这个。 它检查li的大小，如果未找到任何内容，则选择第一个。

function nextImg(){         
    $('#background').find('img').animate({'opacity': 0}, 500, function (){
        var li = $('.sel').parent().parent().next('li').find('a'); 

        if(li.length == 0) {
           //if there is not last item  
           li = $('.sel').parent().parent().first('li').find('a'); //get the first item
        } 
        var liA = li.attr('rel');
        $('#background').find('img').attr({'src':liA});
        $('.sel').appendTo(li); 

    });
}