0
我正在嘗試使用Selectize.js設置一個簡單的選擇框，並且在頁面加載時不斷收到錯誤消息以防止它工作。jQuery與Selectize.js衝突
以下是錯誤
下面的代碼...我只是試圖讓第一選擇框來工作，所以沒有爲其他任何標識或jQuery的。似乎jQuery出於某種原因與selectize.js衝突，我無法弄清楚。嘗試組織腳本標記不同，沒有奏效。
$(function() {
$('#select-category').selectize();
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="css/app.css">
<link rel="stylesheet" type="text/css" media="all" href="css/selectize.css">
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="scripts/scripts.js"></script>
<script type="text/javascript" src="scripts/selectize-custom.js"></script>
<script type="text/javascript" src="scripts/selectize.min.js"></script>
</head>
<body>
<header>
<div class="wrapper">
<a href="" title="">
<h1 id="logo">Maark</h1>
</a>
<div class="nav-bar">
<form>
<label>Single selection
<select id="select-category">
<option value="0">Zero</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
</select>
</label>
<label>Multiple selection
<select multiple>
<option value="0">Zero</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
</select>
</label>
</form>
</div>
</div>
</header>
<div class="main-container container-fluid">
<ul class="row">
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="brub" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="#" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
<li class="gallery-list-item col-md-3 col-sm-4">
<figure>
<a class="" href="#">
<img class="img-responsive" src="images/sample-thumb.png" alt="">
</a>
<figcaption>
<a href="" title="">01_homepage-dashboard</a>
</figcaption>
</figure>
</li>
</ul>
</div>
</body>
</html>
我相信你在聲明函數之前** **定義庫。將'scripts/scripts.js'移到'scripts/selectize.min.js'後面，讓我們知道發生了什麼。我第二@新浪的建議是 – Sina
。 Fwiw，當我將它加載到RequireJS項目中時，我也看到了Selectize中的這個錯誤 - 但基本上你的代碼不明白「selectize」實際上是指那個庫，它不知道名稱。另一個解決方案是爲我工作的，它是在selectize.js之前加載兩個依賴關係（sifter.js和microplugin.js），並在您的scriipts.js文件之前加載。我不知道你是否需要像我那樣加載的依賴，但如果上述失敗，你可以嘗試。希望有所幫助。 – RoboBear