Question

我有一个无限的滚动图库，它使用这样的标记（通过CSS转换为水平显示）：

<div>
    <ul>
        <li><img id="placeHolder" class="photo" .../></li>
    </ul>
</div>

现在，我有一些jQuery用子弹（li）填充UL元素，子弹本身包含图像。

过去一定数量的图像后，应删除第一张图像。这就是以下代码应该做的事情。

// Limit to max
if( $('.photo:visible').size() >= maxPhotos ){
        $(".photo:first").parent().remove(); // Remove li also removes img
}

但是，它似乎也会在一段时间后删除UL。

关于如何避免这种情况的任何建议？

Answer 1

var $photos = $('.photo:visible');
if( $photos.length >= maxPhotos ){
    $photos.first().parent('li').remove();
}

.parent()可以选择
不要两次选择.photo元素
使用.length代替.size()

Answer 2

您可以在删除之前检查以确保它是<li>标记。

// Limit to max
if( $('.photo:visible').size() >= maxPhotos && $(".photo:first").parent().tagName == 'li'){
        $(".photo:first").parent().remove(); // Remove li also removes img
}

Answer 3

试试这个

if( $('.photo:visible').size() >= maxPhotos ){
        $(".photo:first").closest("li").remove(); // Remove li also removes img
}

Answer 4

这将确保它是一个li标签

if( $('.photo:visible').size() >= maxPhotos ){
    $(".photo:first").closest('li').remove(); // Remove li also removes img
}

如何避免使用此代码删除ul元素？

4 个答案: