$(...).selectpicker不是函数 [英] $(...).selectpicker is not a function

问题描述

我正在使用表格引导选择.我在HTML文件的标题中包含了脚本(jquery，bootstrap-select).

I am using bootstrap-select for a form. I include the scripts (jquery, bootstrap-select) in the header of the HTML file.

<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"类的选择元素均已正确调用.选择元素的示例:

All the select elements with class "selectpicker" all called correctly. Example of the select element:

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

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

However, if I call the following script on the same page

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

我收到这个令人讨厌的错误

I get this nasty error

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

$(...).selectpicker is not a function

在Google Chrome浏览器的源"选项卡上，我看到bootstrap-select.min.js加载得很好.有人有建议吗?

Looking at the sources tab in Google Chrome, I see that the bootstrap-select.min.js is loaded well. Has anyone got suggestions?

推荐答案

如果在 bootstrap-select.min.js 之后加载了另一个jquery.js参考，它将清除$(...).selectpicker功能和其他功能.确保bootstrap-select.min.js最后加载.

If you have another jquery.js reference that is loading after bootstrap-select.min.js it will wipe out $(...).selectpicker function and other functions. Make sure that bootstrap-select.min.js is loaded last.

这篇关于$(...).selectpicker不是函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！