Ẩn Twitter Bootstrap mũi tên trái và phải nếu chỉ có một thanh trượt là

Question

Tôi đã cố gắng ẩn các nút trái và phải của Bootstrap Carousel nếu chỉ có một thanh trượt nhưng dường như không thể làm cho nó hoạt động đúng cách.

Tôi đã thử

if ($('.carousel-inner div').length === 1) { 
     $(this).find('.controls .carousel-control').hide(); 
    } 

và

if($('.carousel-inner .item').is(':only-child')) { 
    $(this).find('.controls .carousel-control').hide(); 

Nếu không có bất kỳ may mắn.

Có một lý do cụ thể khiến cả hai cách này không hoạt động? Bàn điều khiển trả về số lượng thanh trượt chính xác cho .length và tôi sử dụng chính xác phương thức .hide trên một chức năng khác nhau đối phó với băng chuyền này.

Answer 1

Thay vì $(this).find(...).hide(); thử $('.controls .carousel-control').hide();

Answer 2

Câu trả lời được chấp nhận hoạt động tốt chừng nào bạn có 1 băng chuyền mỗi trang. Tôi đã có một vài để nghĩ rằng tôi muốn thêm vào các giải pháp:

Dựa trên bằng cách sử dụng tiêu chuẩn Bootstrap Carousel Đánh dấu lên:

<div id="myCarousel" class="carousel slide"> 
    <ol class="carousel-indicators"> 
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
    <li data-target="#myCarousel" data-slide-to="1"></li> 
    <li data-target="#myCarousel" data-slide-to="2"></li> 
    </ol> 
    <!-- Carousel items --> 
    <div class="carousel-inner"> 
    <div class="active item">…</div> 
    <div class="item">…</div> 
    <div class="item">…</div> 
    </div> 
    <!-- Carousel nav --> 
    <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a> 
    <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a> 
</div> 

Bạn sẽ muốn lặp qua mỗi lần xuất hiện của một băng chuyền, sử dụng $ (này) và lấy anh chị em của nó:

$('.carousel-inner').each(function() { 

    if ($(this).children('div').length === 1) $(this).siblings('.carousel-control, .carousel-indicators').hide(); 

});