Uncaught TypeError：$（...）。select2不是函数

我下载了select2包，并在我的laravel公共文件select2.min.css中包含了两个文件select2.min.css和select2.min.js到公共/ css文件夹和select2.min.js到公共/ js文件夹我想在我的页面上做多选。这里是我的“选择”，如：

<select class="form-control js-example-basic-multiple" name="tags"   
    multiple="multiple"> 
    @foreach($tags as $tag) 
     <option value='{{ $tag->id }}'>{{ $tag->name }}</option> 
    @endforeach 
</select>*

这是我<script>部分：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script src="{{ URL::to('js/select2.min.js') }}"></script></script> 
<script> 
     $(document).ready(function(){ 
      $(".js-example-basic-multiple").select2(); 
     }); 
</script>

我不知道多选择不工作，浏览器总是显示“未捕获的类型错误：$（ ...）select2不是函数“

大家都遇到过这个问题吗？

来源

2016-09-21 Nick Zhang

确保您只有一个版本加载。 – Barmar

我使用CDN 这仍然不起作用。 –

@NickZhang Barmar的意思是确保您没有在页面的任何其他位置加载另一个jQuery实例。这样做将取代第一个，因此，删除任何注册的插件 – Phil

最可能的原因是加载jQuery两次。第二次当jQuery加载它删除注册的插件。

解决方案是

脚本装载应在纠正顺序。那就是

1. jQuery, 
2. select2, 
3. your js files

jQuery应该只加载一次。

来源

2017-03-08 12:15:01

在我的情况下，它在angular 2 project.config.ts中被引用两次 – leeroya

在你没有标签，或者jQuery的负载的顺序控制两倍的情况下，比如你是一个内容编辑器：jQuery的的

// Concept: Render select2 fields after all javascript has finished loading 
var initSelect2 = function(){ 

    // function that will initialize the select2 plugin, to be triggered later 
    var renderSelect = function(){ 
     $('section#formSection select').each(function(){ 
      $(this).select2({ 
       'dropdownCssClass': 'dropdown-hover', 
       'width': '', 
       'minimumResultsForSearch': -1, 
      }); 
     }) 
    }; 

    // create select2 HTML elements 
    var style = document.createElement('link'); 
    var script = document.createElement('script'); 
    style.rel = 'stylesheet'; 
    style.href = 'https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/css/select2.min.css';  
    script.type = 'text/javascript'; 
    script.src = 'https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/js/select2.full.min.js'; 

    // trigger the select2 initialization once the script tag has finished loading 
    script.onload = renderSelect; 

    // render the style and script tags into the DOM 
    document.getElementsByTagName('head')[0].appendChild(style); 
    document.getElementsByTagName('head')[0].appendChild(script); 
}; 

initSelect2();

来源

2017-10-12 00:57:26 EdC

Uncaught TypeError：$（...）。select2不是函数

回答

相关问题