$(...).selectpicker不是一个函数

Question

我正在使用bootstrap-select表单.我在HTML文件的标题中包含脚本(jquery,bootstrap-select).

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/css/bootstrap-select.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js"></script>
<link rel="stylesheet "type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

所有具有"selectpicker"类的select元素都被正确调用.select元素的示例:

<select id="test" class="selectpicker">
        <option>Mustard</option>
        <option>Ketchup</option>
        <option>Relish</option>
</select>

但是,如果我在同一页面上调用以下脚本

<script>
$(document).ready(
    function () {
        $('#test').selectpicker('val', 'Relish')
});
</script>

我得到了这个令人讨厌的错误

$(...).selectpicker不是一个函数

查看Google Chrome中的"来源"标签,我看到bootstrap-select.min.js已加载好.有人有建议吗？

Answer 1

如果你jquery.js在bootstrap-select.min.js之后加载了另一个引用,它将清除$(...).selectpicker函数和其他函数.确保最后加载bootstrap-select.min.js.