Jquery 引导模式转盘未在上一幻灯片链接上显示上一幻灯片

我正在使用bootstrap3并尝试使用Bootstrap模式旋转木马显示图像库。我从github找到了下面提到的代码。除了上一个幻灯片链接外，其他一切正常。它不会使滑块向后移动到previus幻灯片/图像。谁能帮我解决这个问题

以下是HTML：

<div class="container">
    <div>
        <div class="row thumb-gallery">
            <div class="col-lg-3 col-sm-4 col-xs-6"><a title="Deer Yard 1" href="#">
                <img class="thumbnail img-responsive" src="images/Deer-Yards-1.jpg"></a>
            </div>
            <div class="col-lg-3 col-sm-4 col-xs-6"><a title="Deer Yard 2" href="#">
                <img class="thumbnail img-responsive" src="images/Deer-Yards-2.jpg"></a>
            </div>
            <div class="col-lg-3 col-sm-4 col-xs-6"><a title="Deer Yard 3" href="#">
                <img class="thumbnail img-responsive" src="images/Deer-Yards-3.jpg"></a>
            </div>
        </div>
    </div>
</div>





 <div class="modal" id="myModal" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button class="close" type="button" data-dismiss="modal">×</button>
                <h3 class="modal-title"></h3>
            </div>
            <div class="modal-body">
                <div id="modalCarousel" class="carousel">
                    <div class="carousel-inner"></div>
                    <a class="carousel-control left" href="#modaCarousel" data-slide="prev"><i class="glyphicon glyphicon-chevron-left"></i></a>
                    <a class="carousel-control right" href="#modalCarousel" data-slide="next"><i class="glyphicon glyphicon-chevron-right"></i></a>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div><!--modal content-->
    </div> <!--modal dialog-->
</div>

×
接近

我正在使用jquery代码：

/* copy loaded thumbnails into carousel */
$('.row .thumbnail').on('load', function() {

}).each(function(i) {
  if(this.complete) {
    var item = $('<div class="item"></div>');

    var itemDiv = $(this).parents('div');
    var title = $(this).parent('a').attr("title");

    item.attr("title",title);
    $(itemDiv.html()).appendTo(item);
    item.appendTo('.carousel-inner'); 
    if (i==0){ // set first item active
     item.addClass('active');
    }
  }
});

/* activate the carousel */
$('#modalCarousel').carousel({interval:false});

/* change modal title when slide changes */
$('#modalCarousel').on('slid.bs.carousel', function () {
  $('.modal-title').html($(this).find('.active').attr("title"));
})

/* when clicking a thumbnail */
$('.row .thumbnail').click(function(){
    var idx = $(this).parents('div').index();
    var id = parseInt(idx);
    $('#myModal').modal('show'); // show the modal
    $('#modalCarousel').carousel(id); // slide carousel to selected
});

/*将加载的缩略图复制到旋转木马中*/
$（'.row.缩略图'）。在（'load'，function（）上{
}).每项功能（i）{
如果（完成此项）{
var项目=$（''）；
var itemDiv=$（this.parents（'div'）；
var title=$（this.parent（'a'）.attr（“title”）；
项目属性（“标题”，标题）；
$（itemDiv.html（））.appendTo（item）；
项目.附件（'.carousel-inner'）；
如果（i==0）{//将第一项设置为活动项
item.addClass（“活动”）；
}
}
});
/*启动旋转木马*/
$（'modalCarousel'）.carousel（{interval:false}）；
/*幻灯片更改时更改模式标题*/
$（'modalCarousel'）.on（'slided.bs.carousel'，函数（）{
$（'.modal title'）.html（$（this.find（'.active'）.attr（“title”））；
})
/*单击缩略图时*/
$（'.row.缩略图'）。单击（函数（）{
var idx=$（this.parents（'div'）.index（）；
var id=parseInt（idx）；
$（'#myModal'）.modal（'show'）；//显示模态
$（'#modalCarousel'）.carousel（id）；//将carousel滑动到选定位置
});

您的代码中有一个非常小的输入错误

这是HTML中的一个标记（省略其中的图标）：

。。。应该是：

<a class="carousel-control left" href="#modalCarousel" data-slide="prev"></a>

来证明它是有效的

调试时，请确保从源代码（在本例中为按钮本身）开始并向后操作，以确保每一行代码都按预期编写并按预期运行。

---

在上面的代码中，href应该是href=“#modalCarousel”而不是href=“#modaCarousel”

我非常感谢您给我一些时间回答我的问题。我确实花了一整天的时间来处理代码。现在它的工作正是我想要的：）这是一个8个月前被接受的答案的坏拷贝。

<a class="carousel-control left" href="#modalCarousel" data-slide="prev"></a>