Подтвердить что ты не робот

Select2() не является функцией

Итак, я загрузил select2, я "установил его", поместив его в свою папку, а затем загрузил его на свой сайт, когда я проверяю консоль (где я могу видеть все загружаемые скрипты), я вижу файл select2.js

Я пошел к их документации и скопировал его и добавил $("#e9").select2();

Однако, когда я загружаю страницу, я получаю следующую ошибку:

TypeError: $(...).select2 is not a function


$("#e9").select2();

У кого-нибудь еще было что-то подобное?

Дополнительная информация здесь: script:

    jQuery(document).ready(function(){
    var max_amount = parseFloat($('#max_amount').val());
    $( "#item_amount" ).keyup(function() {
           if($(this).val() > max_amount){
            $(this).val( max_amount);
        }
        if( /\D/.test($(this).val()) ){
            alert('Må kun indeholde tal!');
            $(this).val('');
        }
        if($(this).val()== '0'){
            alert('Må ikke være 0!');
            $(this).val('');
        }
    });
    $("#e1").select2();

});
function addToBasket(){
    var amount = $('#item_amount').val();
    if(amount == ""){
        amount = 1;
    }

    if(amount > 0){
    $.ajax({
        type: 'POST',
        url: myBaseUrl + 'Products/addItemToBasket',
        dataType: 'json',
        data: {
            id: window.location.pathname.substring(window.location.pathname.lastIndexOf('/') + 1),
            amount: amount
        },
        success: function (data) {
            var urlToBasket = myBaseUrl+'Products/basket';
            var newAmount = parseInt(amount)
            var price = data[0]['Product']['pris'];
            var id = data[0]['Product']['id'];
            var dat = data;
            var tmp_basket_html = $('#basket_amount').html();
           if($('#basket_amount').html() !== " Tom"){
              $('#shopping_table_body').append(
                  "<tr id='"+id+"'>" +
                      "<td class='image'>" +
                      ""+
                      "</td>" +
                      "<td class='name'>" +
                      " "+data[0]['Product']['name'] +
                      "</td>"+
                      "<td class='quantity'>" +
                      "x "+amount +""+
                      "</td>"+
                      "<td class='total'>" +
                      ""+price*amount+
                      "</td>" +
                      ""+
                      "<td class='remove'>" +
                      "<input class='icon-remove' type='button' onclick='removeItemFromBasket("+id+")'>"+
                      "</td>"+
                      "</tr>"
              );
           }else{
               $("#shopping_menu").append(
                   "<ul class='dropdown-menu topcartopen'>"+
                       "<li id='basket_list'>"+
                      "<table id='shopping_table'>"+
                        "<tbody id='shopping_table_body'>"+
                       "<tr id='"+id+"'>" +
                       "<td class='image'>" +
                       ""+
                       "</td>" +
                       "<td class='name'>" +
                       " "+data[0]['Product']['name'] +
                       "</td>"+
                       "<td class='quantity'>" +
                       "x "+amount +""+
                       "</td>"+
                       "<td class='total'>" +
                       ""+price*amount+
                       "</td>" +
                       ""+
                       "<td class='remove'>" +
                       "<input class='icon-remove' type='button' onclick='removeItemFromBasket("+id+")'>"+
                       "</td>"+
                       "</tr>"+
                       "</table>"+
                       "</li>"+
                       "<div class='well pull-right'>"+
                       "<input type='button' onclick='goToBasket()' class='btn btn-success' value='Tjek ud'>"+
                       "</div>"+
                       "</ul>"

               )
           }
            updateTotal(amount,price);
            updateBasketAmount();
        }
    });
    }
    Notifier.success('Vare tilføjet', 'Tilføjet'); // text and title are both optional.
}
function updateTotal(amount, price){
    var price = parseFloat(price);
    var oldValue = parseFloat($('#basket_total_cost').html());
    var newPrice = amount*price+oldValue;
    $('#basket_total_cost').html(newPrice);
}
function updateBasketAmount(){
   var tmp =  $('#basket_amount').html();
    if(!isNaN(tmp)){
   var oldAmount = parseInt(tmp.substr(0,2));
    var i = oldAmount + 1;;
    $('#basket_amount').html(
        ""+i+" vare(r)"
    );
    }else{
        $('#basket_amount').html(
            "1"+" vare(r)"
        );
    }
}
function goToBasket(){
    window.location.href = myBaseUrl+'Products/basket';
}
4b9b3361

Ответ 1

У меня была эта проблема, когда я начал использовать select2 с XCrud. Я решил это, отключив XCrud от загрузки JQuery, это было во второй раз и загрузило его под тегом body. Поэтому убедитесь, что JQuery не загружается дважды на вашей странице.

Ответ 2

Эта ошибка возникает, если ваши файлы js, где вы ограничили флажок select2 при выборе, загружаются перед select2 js файлами. Пожалуйста, убедитесь, что файлы должны быть в таком порядке, как..

  • JQuery
  • select2 js
  • ваш js

Ответ 3

Я также столкнулся с такой же проблемой и заметил, что эта ошибка возникла из-за того, что селектор, на котором я использую select2, не существовал или не был загружен.

Поэтому убедитесь, что $( "# selector" ) существует, выполняя

if ($("#selector").length > 0)
   $("#selector").select2();

Ответ 4

Была такая же проблема. Сортировать по отложенной загрузке select2

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/js/select2.min.js" defer></script>

Ответ 5

Поместите config.assets.debug = false в config/environment/development.rb.

Ответ 6

Проблема довольно старая, но я приведу небольшую заметку, поскольку я потратил пару часов на расследование этой же проблемы. После того, как я загрузил часть кода, динамический select2 не мог работать в новых selectboxes с ошибкой "$ (...). Select2 не является функцией".

Я обнаружил, что в не упакованном select2.js есть строка, которая препятствует ее переработке основной функции (в моей версии 3.5.4 она находится в строке 45):

if (window.Select2 !== undefined) {
    return;
}

Итак, я просто прокомментировал это и начал использовать select2.js(вместо мини-версии).

//if (window.Select2 !== undefined) {
//    return;
//}

И он начал работать очень хорошо, конечно, теперь он может обрабатывать несколько раз, теряя производительность, но мне все равно нужно.

Надеюсь, это поможет, Владимир

Ответ 7

вы можете ссылаться на два сценария jquery, которые дают указанную выше ошибку.

Ответ 8

Я использовал тонкую версию jQuery и получил эту ошибку. Используя обычную версию jQuery, проблема была решена.

Ответ 9

Для меня файл select2.min.js работал вместо select2.full.min.js. Я вручную определил файлы, которые я скопировал из папки dist, которую я получил со страницы github. Также убедитесь, что у вас есть одно определение jQuery(document).ready(...) и файл jquery, импортированные перед файлом select2.

Ответ 10

Для новичков, таких как я, которые в конечном итоге задаются этим вопросом: эта ошибка также происходит, если вы пытаетесь вызвать .select2() для элемента, полученного с использованием чистого javascript и не использующего jQuery.

Это приводит к ошибке "select2 is not function":

document.getElementById('e9').select2();

Это работает:

$("#e9").select2();

Ответ 11

сначала попробуйте очистить кеш браузера Ctrl + Shift + Del затем перезагрузите страницу. Главная