javascript - 使用 Bootstrap-select 返回 "$(...).data(...).on is not a function" 类型错误

Question

<script type="text/javascript" src="../libcommon/bootstrap/js/bootstrap-select.js"></script> 
<link rel="stylesheet" href="../libcommon/bootstrap/css/bootstrap-select.css" type="text/css"/> 


$(document).ready(function() {
$('.selectpicker').selectpicker('val', 'All');
});

echo "<select name=\"years_sel\" id=\"mySelectBox\" class=\"selectpicker show-tick form-control\" multiple=\"multiple\" data-live-search=\"true\">";

代码如上所示。我收到以下错误

1.

TypeError: $(...).data(...).on 不是函数

2.

TypeError：e.stopPropagation 不是函数

我仍然包括CSS。但没有下拉箭头。

下拉看起来像下面的图像

Answer 1

在设置值之前，请确保 selectpicker 已完全初始化：

$('.selectpicker').selectpicker();
$('.selectpicker').selectpicker('val', 'All');

你也可以用jquery的val设置值，然后调用render：

$('.selectpicker').val('All');
$('.selectpicker').selectpicker('render');

Answer 2

您还没有包含 Jquery，请检查是否加载了 jQuery 库

  if (typeof jQuery != 'undefined') {

    alert("jQuery library is loaded!");

}else{

    alert("jQuery library is not found!");

}

参考：http ://www.mkyong.com/jquery/how-to-check-if-jquery-library-is-loaded/

Answer 3

从您的页面中删除此代码：

$('.selectpicker').selectpicker();

仅使用.selectpicker类来创建选择框。