Bootstrap輪播控件不能與node.js一起使用

Question

創建一個航海網站，在推薦部分，左右控件和指示器沒有響應。 這是因為我沒有在app.js中包含或調用該函數，或者我錯過了一些jQuery？ （使用.ejs）

我已經研究了slick-carousel-npm和其他軟件包，在簡單的HTML和CSS形式中代碼也不起作用。

<section class="colouredSection">
  <div id="sectionContainer">

    <div id="myCarousel" class="carousel slide" data-ride="carousel">
      <!-- Indicators -->
      <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>

      <!-- Wrapper for slides -->
      <div class="carousel-inner">
        <div class="item active">
            <h2 class="testimonial-text">"What a beautiful day! Our skipper was amazing and even taught us how to sail a bit. I would
              definitely recommend and repeat in the future!!! A perfect way to spend an afternoon in Barcelona."</h2>
        </div>
        <div class="item">
          <h2 class="testimonial-text">"What a beautiful day! Our skipper was amazing and even taught us how to sail a bit. I would
            definitely recommend and repeat in the future!!! A perfect way to spend an afternoon in Barcelona."</h2>
      </div>
        <div class="item">
          <h2 class="testimonial-text">"What a beautiful day! Our skipper was amazing and even taught us how to sail a bit. I would
            definitely recommend and repeat in the future!!! A perfect way to spend an afternoon in Barcelona."</h2>
      </div>
      </div>

      <!-- Left and right controls -->
      <a class="left carousel-control" href="#myCarousel" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
        <span class="sr-only">Previous</span>
      </a>
      <a class="right carousel-control" href="#myCarousel" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
        <span class="sr-only">Next</span>
      </a>
    </div>
  </div>
</section>

<!-- CSS -->
  <link rel="stylesheet" href="css/styles.css">
  <!-- Font Awesome -->
  <script defer src="https://use.fontawesome.com/releases/v5.0.7/js/all.js"></script>
  <!-- Google Fonts -->
  <link href="https://fonts.googleapis.com/css?family=Montserrat:400,400i,800,800i|Special+Elite|Playfair+Display:400i" rel="stylesheet">
<!-- Bootstrap -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

在app.get（“/”中，我沒有提到旋轉木馬。當我希望它通過航行旅行評論的幻燈片時沒有響應。

Answer 1

您需要在<body>標記中的某處包含utils.js或bootstrap.js 。

最后，如果您從源代碼構建JavaScript，則需要util.js.

https://getbootstrap.com/docs/4.0/components/carousel/

所有Bootstrap的JavaScript文件都依賴於util.js，它必須與其他JavaScript文件一起包含在內。 如果你正在使用編譯的（或縮小的）bootstrap.js，則不需要包含它 - 它已經存在了。

https://getbootstrap.com/docs/4.0/getting-started/javascript/#util

Bootstrap輪播控件不能與node.js一起使用

問題描述

1 個解決方案

解決方案1
0 2019-04-10 01:00:29

Bootstrap輪播控件不能與node.js一起使用

問題描述

1 個解決方案

解決方案1 0 2019-04-10 01:00:29

解決方案1
0 2019-04-10 01:00:29