文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
社区首页 >问答首页 >jQuery与Selectize.js冲突

问jQuery与Selectize.js冲突
EN

Stack Overflow用户
提问于 2016-07-27 11:04:38
回答 1查看 679关注 0票数 0

我正在尝试用Selectize.js设置一个简单的选择框，并在页面加载时不断收到错误消息，使其无法正常工作。

下面是错误

​

​

下面是代码……我只是想让第一个选择框正常工作，这样另一个选择框就没有id或jquery了。由于某些原因，jquery似乎与selectize.js发生了冲突，而我却无法解决这个问题。尝试以不同的方式组织脚本标记，但不起作用。

​

代码语言：javascript
复制
$(function() {
  $('#select-category').selectize();
});
代码语言：javascript
复制
<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>

​

jquery
selectize.js
EN

回答 1

Stack Overflow用户

发布于 2016-07-27 11:23:08

您的selectize.js似乎没有正确包含到当前文件中。

首先，您需要检查js文件的当前路径是否有效。

另外，尝试在当前路径中添加一个点斜杠。喜欢；

​

对于本地添加的jQuery文件，这也是一个非常常见的问题。检查：

jQuery code doesn't work if I'm using a local jquery.js file, why?

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：

https://stackoverflow.com/questions/38603015

复制
相关文章

相似问题

领券

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

热门推荐

更多推荐

Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 

深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

腾讯云计算（北京）有限责任公司 京ICP证150476号 |  京ICP备11018762号

问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档