선택2()는 함수가 아닙니다.

선택2()는 함수가 아닙니다.

select2를 다운받아 폴더에 넣어 '설치'하였습니다.
그런 다음 내 사이트에 로드했고 콘솔을 확인하면 파일이 표시됩니다.select2.js(모든 스크립트가 로드되는 것을 볼 수 있습니다.)

나는 그들의 문서를 보고 복사해서 추가했습니다.$("#e9").select2();

그러나 페이지를 로드하면 다음 오류가 발생합니다.

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

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

이런 일을 겪은 사람이 또 있습니까?

자세한 내용은 다음과 같습니다.

    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';
}

XCrud와 함께 select2를 사용하기 시작했을 때 이 문제가 있었습니다.저는 JQuery를 로드할 때부터 XCrud를 비활성화하여 두 번째로 바디 태그 아래에 로드하는 방법으로 해결했습니다.따라서 JQuery가 페이지에 두 번 로드되지 않도록 하십시오.

같은 문제가 있었습니다.loading 지연별로 정렬 선택2

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

이 오류는 select2를 선택 상자로 경계 설정한 js 파일이 select2 js 파일을 선택하기 전에 로드되는 경우 발생합니다.파일이 다음과 같은 순서여야 합니다.

• 쥬리
• 선택2js
• 당신의 js

저도 동일한 문제에 직면하여 select2를 사용하고 있는 selector가 존재하지 않거나 로딩되지 않았기 때문에 이 오류가 발생했다는 것을 알게 되었습니다.

따라서 $("#selector")가 존재하는지 확인합니다.

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

더하다$("#id").select2()밖으로document.ready()기능.

위의 오류를 주는 두개의 jquery 스크립트를 참조하는 것일 수 있습니다.

jQuery slim 버전을 사용했는데 이 오류가 발생했습니다.일반 jQuery 버전을 사용하여 문제가 해결되었습니다.

그 문제는 꽤 오래된 것이지만, 오늘 몇 시간 동안 상당히 비슷한 문제를 조사했기 때문에 약간의 메모를 해 두겠습니다.코드 일부를 로드한 후 select2가 새 selectbox에서 "$(...).select2는 함수가 아닙니다"라는 오류와 함께 동적으로 select2를 계산할 수 없습니다.

저는 포장되지 않은 select2.js에는 주 기능을 재처리하는 것을 방해하는 줄이 있다는 것을 발견했습니다(제 3.5.4 버전에서는 줄 45).

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

그래서 저는 그냥 거기에 댓글을 달고 select2.js를 사용하기 시작했습니다(미니드 버전 대신).

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

그리고 그것은 잘 작동하기 시작했습니다. 물론 지금은 성능이 떨어지는 처리를 여러 번 할 수 있지만, 어쨌든 저는 그것이 필요합니다.

이게 도움이 되길 바라네, 블라디미르

놓다config.assets.debug = false구성/환경/개발에서. rb.

나를 위해.select2.min.js 대신 했습니다.select2.full.min.js. github 페이지에서 받은 dist 폴더에서 복사한 파일을 수동으로 정의합니다.또한 당신이 가지고 있는지 확인합니다.jQuery(document).ready(...)select2 파일 이전에 가져온 정의 및 jquery 파일입니다.

저 같은 초보자들은 이런 질문을 하게 됩니다.jQuery를 사용하지 않고 순수 자바스크립트를 사용하여 검색한 요소에서 .select2()를 호출하려고 할 경우에도 이 오류가 발생합니다.

이 경우 "select2 is not function"(2 is not a function) 오류가 발생하며 실패합니다.

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

작동 내용:

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

저의 경우 웹패커와 스프로켓이 모두 jQuery를 가져오려고 할 때 레일스 앱에서 이 오류가 발생했습니다.제 코드 편집기가 자동으로 jQuery를 웹패커 모듈로 가져오려고 할 때까지 저는 그것을 눈치채지 못했습니다.

오늘도 같은 문제를 겪고 있었는데 다른 대답은 하나도 안 통했습니다.이것이 어떻게 또는 왜 작동했는지 이해할 수 없지만, 그것은 작동했고 (나무를 두드렸다) 아직도 작동합니다.

하지만 우선, 저의 구체적인 상황에 대해서 말씀드리겠습니다.

한 .js 파일에서 select2를 사용하다가 다른 .js 파일로 가져오려고 했는데 이 오류가 발생했습니다. jQuery는 다른 .js 문서에서 잘 작동하고 있었고, 두 번째로 사용하려고 한 것은 내가 작성하고 있던 첫 번째 .js 문서보다 html에서 나중에, jquery 및 select2 태그보다 나중에 호출되었습니다.

자, 이제 말은 안 되지만 효과는 있는 솔루션에 대해 설명해 드리겠습니다.

저는 jQuery 요소의 정의를 이전 .js 파일에 넣었고 그 변수의 .select2를 나중 .js 파일에 넣었습니다.이상하죠?그래서, 다음과 같습니다.

<head>
*blah blah blah html headers*
<script src="/static/js/jquery-3.6.0.js"></script>  
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
</head>
<body>
*blah blah blah page stuff*
<script src="/static/js/first.js"></script>
*blah blah some more stuff*
<script src="/static/js/second.js"></script>

첫째.js

const selector = $('#select-this')

second.js

selector.select2({
*&c, &c, &c.*

ControlId.선택2 ({...}); 작동하지 않지만 다음이 작동했습니다.

$(ControlId).선택2 ({...});

때때로 같은 페이지에서 cdn에 의해 재사용될 수 있는 파일을 호출할 수 없는 페이지는 해결될 수 있습니다.

Django를 4.2.4로 업그레이드하고 django-select2==8.1.2로 업그레이드할 때 문제가 생겼습니다.

오류:

jQuery.지연된 예외: $element.select2는 typeError 함수가 아닙니다.

select2.min.js를 다운로드하여 헤더 고정에 추가합니다. ref: https://select2.org/getting-started/installation

언급URL : https://stackoverflow.com/questions/20034522/select2-is-not-a-function