jQuery 中的 Multi-select 即使在按照 multi-select 教程中提到的正确格式添加依赖项后也无法正常工作

Question

我正在尝试使用 multi select 和 jQuery 的复选框插件，如下面的建议 link http://davidstutz.de/bootstrap-multiselect/#getting-started 但是，虽然我在 js fiddle 上实现了测试手段，但没有按预期工作，这里的问题是什么这是 link 到 js fiddle 的测试代码

$('select[multiple]').multiselect();
$('#langOpt').multiselect({
    columns: 1,
    placeholder: 'Select Languages',
    search: true
});

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<!-- MultiSelect CSS & JS library -->
<link href="multiselect/jquery.multiselect.css" rel="stylesheet" />
<script src="multiselect/jquery.multiselect.js"></script>
<select name="langOpt[]" multiple id="langOpt">
    <option value="C++">C++</option>
    <option value="C#">C#</option>
    <option value="Java">Java</option>
    <option value="Objective-C">Objective-C</option>
    <option value="JavaScript">JavaScript</option>
    <option value="Perl">Perl</option>
    <option value="PHP">PHP</option>
    <option value="Ruby on Rails">Ruby on Rails</option>
    <option value="Android">Android</option>
    <option value="iOS">iOS</option>
    <option value="HTML">HTML</option>
    <option value="XML">XML</option>
</select>

Answer 1

在你的 post 中你说你正在使用 jQuery 插件，你确实在你的代码中使用了它，但是 link 和图像是用于 bootstrap-multiselect，它们是不同的。我假设您从一开始就尝试使用 bootstrap 插件，我已将答案更改为 bootstrap-multiselect。

$('select[multiple]').multiselect();

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<!-- Bootstrap -->
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"> 
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>

<!-- MultiSelect CSS & JS library -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/css/bootstrap-multiselect.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/js/bootstrap-multiselect.min.js"></script>
<select name="langOpt[]" multiple id="langOpt">
    <option value="C++">C++</option>
    <option value="C#">C#</option>
    <option value="Java">Java</option>
    <option value="Objective-C">Objective-C</option>
    <option value="JavaScript">JavaScript</option>
    <option value="Perl">Perl</option>
    <option value="PHP">PHP</option>
    <option value="Ruby on Rails">Ruby on Rails</option>
    <option value="Android">Android</option>
    <option value="iOS">iOS</option>
    <option value="HTML">HTML</option>
    <option value="XML">XML</option>
</select>

jQuery 中的 Multi-select 即使在按照 multi-select 教程中提到的正确格式添加依赖项后也无法正常工作

Multi-select in jQuery not working even after the addition of the dependancies in a right format as mentioned in the multi-select Tutorial

javascript

jquery

select

checkbox

multi-select