Php 从服务器加载的模式内的引导转盘

我的模态从我的服务器加载良好，我从我的行id调用数据目标

data target=“#info.”$rows['id'..”“

我的模态调用我的数据目标

id="info'.$rows['id'].'"

这一部分很好，它可以装载所有东西。 问题是我的旋转木马里有缩略图。 它工作只有一个旋转木马打赌第二个不会工作，所以我做的是 在缩略图的“下一步”和“上一步”按钮中将我的行id添加到我的数据目标中…（。$rows['id']）。）

为什么我的拇指坏了

<!-- Carousel nav -->
<a class="left carousel-control" href="#myCarousel'.$rows['id'].'"              

role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>



<a class="right carousel-control" href="#myCarousel'.$rows['id'].'" 

role="button" data-slide="next">

        <?php
        $sql = "SELECT * FROM gallery ";
        $run = mysqli_query($conn,$sql);
        while ($rows = mysqli_fetch_assoc($run)){

            echo'           


   <div class="modal fade" id="info'.$rows['id'].'" role="dialog">

  <div class="modal-dialog modal-xl">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
         <h3 class="modal-title">'.$rows['title'].'</h3>
    </div>
    <div class="modal-body">


          <div class="row">

                    <div class="col-sm-6">

                      <div class="col-sm-12" id="carousel-bounding-box">
                        <div class="carousel slide"   id="myCarousel'.$rows['id'].'">
                            <!-- Carousel items -->
                            <div class="carousel-inner">
                                <div class="item" data-slide-number="0">
                                    <img src="../'.$rows['image'].'"></div>

                                <div class="item" data-slide-number="1">
                                    <img src="../'.$rows['img_v1'].'"></div>

                                <div class="item active" data-slide-number="2">
                                    <img src="../'.$rows['img_v2'].'"></div>

                                <div class="item" data-slide-number="3">
                                    <img src="../'.$rows['img_v3'].'"></div>
                             </div>

                            <!-- Carousel nav -->
                            <a class="left carousel-control" href="#myCarousel'.$rows['id'].'" role="button" data-slide="prev">
                                <span class="glyphicon glyphicon-chevron-left"></span>
                            </a>
                            <a class="right carousel-control" href="#myCarousel'.$rows['id'].'" role="button" data-slide="next">
                                <span class="glyphicon glyphicon-chevron-right"></span>
                            </a>
                        </div>
                    </div>

     </div>


    <div class="row">
        <div class="col-sm-6" id="slider-thumbs">

            <!-- Bottom switcher of slider -->
            <ul class="hide-bullets">
                <li class="col-sm-3">
                <p class="text-center">v.0<p>
                    <a class="thumbnail" id="carousel-selector-0">
                        <img src="../'.$rows['image'].'">
                    </a>
                </li>

                <li class="col-sm-3">
                <p class="text-center">v.1<p>   
                    <a class="thumbnail" id="carousel-selector-1"><img src="../'.$rows['img_v1'].'"></a>
                </li>

                <li class="col-sm-3">
                <p class="text-center">v.2<p>
                    <a class="thumbnail" id="carousel-selector-2"><img src="../'.$rows['img_v2'].'"></a>
                </li>

                <li class="col-sm-3">
                <p class="text-center">v.3<p>
                    <a class="thumbnail" id="carousel-selector-3"><img src="../'.$rows['img_v3'].'"></a>
                </li>


            </ul>
        </div>


    </div>



</div>


  </div>
</div>

    jQuery(document).ready(function($) {

    $('#myCarousel').carousel({
            interval: 5000
    });

    //Handles the carousel thumbnails
    $('[id^=carousel-selector-]').click(function () {
    var id_selector = $(this).attr("id");
    try {
        var id = /-(\d+)$/.exec(id_selector)[1];
        console.log(id_selector, id);
        jQuery('#myCarousel').carousel(parseInt(id));
    } catch (e) {
        console.log('Regex failed!', e);
    }
    });
    // When the carousel slides, auto update the text
    $('#myCarousel').on('slid.bs.carousel', function (e) {
             var id = $('.item.active').data('slide-number');
            $('#carousel-text').html($('#slide-content-'+id).html());
    });
    });