Javascript 如何禁用重复图像的显示？

这是一个脚本，它收集从wordpress管理面板上传到页面的所有图像，并将它们放在滑块中

<div id="slider-box">
  <div id="current">

  </div>
  <div id="all-photos">

  </div>
</div>

Javascript

function setCurrent(first) {
    $('#current').html(first);
}

$(document).ready(function () {
    // set images to preview and remove big images
    $('#content').find('img').each(function () {

        var photoSrc = $(this).attr('src'),
            photoImg = '<img src="' + photoSrc + '">';

        $('#all-photos').append('<div class="photo-template">' + photoImg + '</div>');
        $(this).remove();
    }); // end each


    // set first image preview to current box 
    var firstPhoto = $('#all-photos').find('div.photo-template:first').html()
    setCurrent(firstPhoto);

    // click handler
    $('div.photo-template').on('click', function () {
        var selected = $(this).html();
        setCurrent(selected);
    });
});

函数设置当前值（第一个）{
$（'#current'）.html（第一个）；
}
$（文档）.ready（函数（）{
//将图像设置为预览和删除大图像
$（'#content'）。查找（'img'）。每个（函数（）{
var photoSrc=$（this.attr（'src'），
photoImg=''；
$（“#所有照片”）。附加（“”+photoImg+“”）；
$（this.remove（）；
})//结束每一个
//将第一个图像预览设置为当前框
var firstPhoto=$（“#所有照片”）.find（'div.photo-template:first'）.html（）
设定电流（第一张照片）；
//单击处理程序
$（'div.photo-template'）。在（'click'，函数（）{
var selected=$（this.html（）；
设定电流（已选择）；
});
});

当我在一个页面上添加几张照片时（示例），效果很好，但当我只添加一张照片时，它会复制到带有小图像的框中（示例）

---

当一个页面上只发布一个图像时，如何禁用重复图像的显示？

尝试将此添加到Javascript中，它应该在底部找到图像的数量，然后如果发现有多个图像，它将删除容器

if($('#all-photos .photo-template img').length < 2) {
    $('#all-photos').hide();
}

if（$（'#all photos.photo template img'）。长度<2）{
$（“#所有照片”）.hide（）；
}

希望这有帮助