2017-09-12 91 views
0

不滑動時在控制檯鉻Uncaught ReferenceError: $ is not defined檢查是否有錯誤我能看到我的代碼此錯誤代碼。 什麼可能是我的代碼的問題,任何幫助是值得歡迎的。這是我的代碼。這slider_flow.php。這是鏈接到的網站link我的引導傳送帶FDI傳送帶滑動都

<div class="container"> 
     <div class="row"> 
      <div class="span12"> 
       <div class="well"> 
        <div id="myCarousel" class="carousel fdi-Carousel slide"> 
        <!-- Carousel items --> 
         <div class="carousel fdi-Carousel slide" id="eventCarousel" data-interval="0"> 
          <div class="carousel-inner onebyone-carosel"> 
           <div class="item active"> 
            <div class="col-md-3"> 
             <a href="#"><img src="http://placehold.it/250x250" class="img-responsive center-block"></a> 
             <div class="text-center">1</div> 
            </div> 
           </div> 
           <div class="item"> 
            <div class="col-md-3"> 
             <a href="#"><img src="http://placehold.it/250x250" class="img-responsive center-block"></a> 
             <div class="text-center">2</div> 
            </div> 
           </div> 
           <div class="item"> 
            <div class="col-md-3"> 
             <a href="#"><img src="http://placehold.it/250x250" class="img-responsive center-block"></a> 
             <div class="text-center">3</div> 
            </div> 
           </div> 
           <div class="item"> 
            <div class="col-md-3"> 
             <a href="#"><img src="http://placehold.it/250x250" class="img-responsive center-block"></a> 
             <div class="text-center">4</div> 
            </div> 
           </div> 
           <div class="item"> 
            <div class="col-md-3"> 
             <a href="#"><img src="http://placehold.it/250x250" class="img-responsive center-block"></a> 
             <div class="text-center">5</div> 
            </div> 
           </div> 
           <div class="item"> 
            <div class="col-md-3"> 
             <a href="#"><img src="http://placehold.it/250x250" class="img-responsive center-block"></a> 
             <div class="text-center">6</div> 
            </div> 
           </div> 
           <div class="item"> 
            <div class="col-md-3"> 
             <a href="#"><img src="http://placehold.it/250x250" class="img-responsive center-block"></a> 
             <div class="text-center">7</div> 
            </div> 
           </div> 
          </div> 
          <a class="left carousel-control" href="#eventCarousel" data-slide="prev"></a> 
          <a class="right carousel-control" href="#eventCarousel" data-slide="next"></a> 
         </div> 
         <!--/carousel-inner--> 
        </div><!--/myCarousel--> 
       </div><!--/well--> 
      </div> 
     </div> 
    </div> 

這個我slider_flow.css

.carousel-inner.onebyone-carosel { margin: auto; width: 90%; } 
    .onebyone-carosel .active.left { left: -25.00%; } 
    .onebyone-carosel .active.right { left: 25.00%; } 
    .onebyone-carosel .next { left: 25.00%; } 
    .onebyone-carosel .prev { left: -25.00%; } 

這個我slider_flow.js

$(document).ready(function() { 

    $('.fdi-Carousel .item').each(function() { 
     var next = $(this).next(); 
     if (!next.length) { 
      next = $(this).siblings(':first'); 
     } 
     next.children(':first-child').clone().appendTo($(this)); 

     var next2 = next.next(); 
     if (!next2.length) { 
      next2 = $(this).siblings(':first'); 
     } 
     next2.children(':first-child').clone().appendTo($(this)); 

     var next3 = next2.next(); 
     if(!next3.length){ 
      next3 = $(this).siblings(':first'); 
     } 
     next3.children(':first-child').clone().appendTo($(this)); 
    }); 
}); 

這這裏所有的JS腳本都與整個website.footer.php

<div class="footer-section"> 
       <div class="container"> 
        <div class="footer-top"> 
           <div class="social-icons"> 
             <a href="https://www.facebook.com/WandaSokoLtd/"><i class="icon1"></i></a> 
             <a href="https://twitter.com/WandaSokoLtd"><i class="icon2"></i></a> 
             <!--a href="#"><i class="icon3"></i></a--> 
            </div> 
           </div> 

        <div class="footer-bottom"> 
         <p> Copyright &copy; 
          <script> 
           var currentDate = new Date(), 
            day = currentDate.getDate(), 
            month = currentDate.getMonth() + 1, 
            year = currentDate.getFullYear(); 
           document.write(day + "/" + month + "/" + year) 
          </script> 
          All rights Reserved | by<a href="http://www.wandasoko.org/" target="target_blank">WandaSoko</a> 
         </p> 
        </div> 
      <a class="scroll" href="#home" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a> 

       </div> 
      </div> 
        <!-- jQuery --> 
     <!-- Bootstrap Core JavaScript --> 
     <script src="assets/js/jquery-1.11.1.min.js"></script> 
     <script src="assets/js/responsiveslides.min.js"></script> 
        <script type="text/javascript"> 
         $(document).ready(function() { 

          $().UItoTop({ easingType: 'easeOutQuart' }); 

         }); 
        </script> 
     <!-- script for menu -->     
     <script> 
      $("label.menu").click(function(){ 
      $(".top-menu ul").slideToggle("slow" , function(){ 
      }); 
      }); 
     </script> 
     <!-- //script for menu --> 

     <!-- other useful jquery --> 
     <script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script> 
     <script> 
       $(function() { 
        $("#slider").responsiveSlides({ 
        auto: true, 
        nav: true, 
        speed: 500, 
        namespace: "callbacks", 
        pager: true, 
        }); 
       }); 
     </script> 

         <!-- start-smoth-scrolling--> 
     <script type="text/javascript" src="assets/js/move-top.js"></script> 
     <script type="text/javascript" src="assets/js/easing.js"></script> 
      <script type="text/javascript"> 
       jQuery(document).ready(function($) { 
        $(".scroll").click(function(event){  
         event.preventDefault(); 
         $('html,body').animate({scrollTop:$(this.hash).offset().top},1200); 
        }); 
       }); 
      </script> 
     <script src="assets/js/slider_flow.js"></script> 
     <!--End-smoth-scrolling--> 

      <script src="assets/js/jquery.swipebox.min.js"></script> 
       <script type="text/javascript"> 
        jQuery(function($) { 
         $(".swipebox").swipebox(); 
        }); 
       </script> 
       <script type="text/javascript"> 
         $(document).ready(function() { 
         $('#myCarousel').carousel({ 
         interval: 10000 
          }) 
         }); 
       </script> 

    </body> 
</html> 

回答

1

您需要導入的jQuery之前,你可以使用它:

<script src="assets/js/jquery-1.11.1.min.js"></script> <!-- This must be before any jQuery use --> 
    <script src="assets/js/bootstrap.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 

      $().UItoTop({ easingType: 'easeOutQuart' }); 

     }); 
    </script> 
+0

即使它不工作的所有其他的jQuery腳本之前在導入後。 – harri

+0

這是鏈接到測試環境[鏈接](http://testmail.haoyetu.com) – harri

+0

@harri看着你的測試環境中的代碼jQuery的進口仍然在同一個地方。嘗試移動線249(jQuery的進口)到第25行 –