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不是函數

回答

相關問題