Visual Studio上的Javascript

Question

您好，我使用Visual Studio 2017，我有一個基於html的網站。 我想使用已經可以在Codepen上使用的光滑滑塊，但是當我放入Visual Studio中時，javascript無法正常工作，請幫助我！

滑塊示例

console.clear();
  $(".slider").slick({
      autoplay: true,    
      slidesToShow: 4,
      dots: false,
      responsive: [{ 
          breakpoint: 500,
          settings: {
              dots: false,
              arrows: false,
              infinite: false,
              slidesToShow: 2,
              slidesToScroll: 2
          } 
      }]
  });

Answer 1

看一下您是否在代碼的head標簽處添加了庫。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>

另外，請確保在腳本之前加載它。 在codepen中，您可以將庫添加到設置中，因此也許您忘記了將其加載到VS中的代碼中。 如果那不能解決您的問題，那么如果您看一下您的控制台錯誤，那就太好了……這樣我們就可以知道問題並為您提供更好的幫助。

Answer 2

我的圖書館是：

 <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" /> <link rel="stylesheet" href="https://anijs.github.io/lib/anicollection/anicollection.css"/> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" /> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <link href="css/home.css" rel="stylesheet" /> <script src="js/carousel.js"></script> <script src="js/test.js"></script> 

如您在第一張照片中所看到的，我已經放入了test.js，其中包含了所有調用aspx的javascrpit代碼

我的css文件：

 #dealss .slick-slider { font-size: 30px; line-height: 1; text-align: center; color: white; } .slick-slide { background: rgba(255,255,255,.4); padding: 40px 0; 

#dealss .slick-slider { font-size: 30px; line-height: 1; text-align: center; color: white; } .slick-slide { background: rgba(255,255,255,.4); padding: 40px 0;

 #dealss .slick-slider { font-size: 30px; line-height: 1; text-align: center; color: white; } .slick-slide { background: rgba(255,255,255,.4); padding: 40px 0; 

}

我的結果是： 結果