TypeError: $ .ajax (…) nie jest funkcją?


231

Próbuję utworzyć proste żądanie AJAX, które zwraca niektóre dane z bazy danych MySQL. Oto moja funkcja poniżej:

function AJAXrequest(url, postedData, callback) {
    $.ajax() ({
        type: 'POST',
        url: url,
        data: postedData,
        dataType: 'json',
        success: callback
    });
}

... i tutaj go nazywam, analizując wymagane parametry:

AJAXrequest('voting.ajax.php', imageData, function(data) {
    console.log("success!");
});

Jednak moje wywołanie zwrotne sukcesu nie działa (ponieważ „sukces!” Nie jest zalogowany do konsoli), aw konsoli pojawia się błąd:

TypeError: $.ajax(...) is not a function.
success: callback

Co to znaczy? Wcześniej wykonywałem żądania AJAX, gdy zdarzenie pomyślne wyzwala anonimową funkcję w $ .ajax, ale teraz próbuję uruchomić osobną funkcję nazwaną (w tym przypadku wywołanie zwrotne). Jak mam to zrobić?


2
czy uwzględniono jquery
— Arun P. Johny

2
zmień to $ .ajax () ({na $ .ajax ({
— Prabhu Murthy

3
Nazwałeś $.ajaxbez argumentów ( $.ajax()) i wartość zwracana jest obiektem jqXHR, która nie jest funkcją. Dlatego $.ajax()(...)wyrzuci błąd.
— Felix Kling

2
albo pominąłeś dołączenie jquery.js LUB podłączyłeś jquery.js poniżej wywołania funkcji LUB spróbuj wypróbować jQuery.ajax (zamień $ na jQuery).
— Pranay Bhardwaj

90
W moim przypadku jest tak dlatego, że użyłem wąskiej, zminimalizowanej wersji JQuery, która pobiera funkcję ajax
— TomNg,

Odpowiedzi:


952

Żadna z odpowiedzi tutaj nie pomogła mi. Problem polegał na tym, że używałem cienkiej wersji jQuery , która usunęła pewne rzeczy, a jedną z nich jest ajax.

Rozwiązanie: Wystarczy pobrać regularne (skompresowany lub nie) wersję jQuery tutaj i umieścić go w swoim projekcie.


56
To naprawiło mój problem! Co do cholery jQuery ?? Dlaczego jest $.ajaxusuwany z „cienkiej” wersji?
— samnau

57
Smukła budowa pochłonęła kolejną ofiarę.
— Drew Kennedy,

49
Skopiowałem kod z Bootstrap. Używają wersji slim. Może ty też
— Cyril N.

126

Sprawdź dwukrotnie, czy używasz pełnej wersji jquery, a nie jakiejś smukłej wersji.

Korzystałem z linku do skryptu cdn-jquery, który jest dołączony do jquery. Problem polega na tym, że domyślnie jest to slim.jquery.js, który nie ma w sobie tej ajaxfunkcji. Jeśli więc używasz (sklejonego ze strony Bootstrap) skróconego linku do skryptu jquery, użyj pełnej wersji.

To znaczy użyj <script src="https://code.jquery.com/jquery-3.1.1.min.js"> zamiast <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"


27

Nie jestem pewien, ale wygląda na to, że masz błąd składniowy w kodzie. Próbować:

$.ajax({
  type: 'POST',
  url: url,
  data: postedData,
  dataType: 'json',
  success: callback
});

Miałeś dodatkowe nawiasy, $.ajaxktóre nie były potrzebne. Jeśli nadal pojawia się błąd, plik skryptu jQuery nie jest ładowany.


2
To nie jest błąd składniowy. Oczekiwano, że zwracana wartość będzie funkcją, która nie jest.
— Felix Kling

Ach, rozumiem. Tak naprawdę, ten problem to tak naprawdę brakujące odniesienie do pliku skryptu jQuery.
— Jason Evans,

3
Nie. Spójrz na to jak $.ajax()();. To jest poprawny JavaScript. Oznacza „zadzwoń $.ajaxi cokolwiek zwróci, zadzwoń również”. Ale $.ajaxnie zwraca funkcji (którą można wywołać), zwraca jqXHRobiekt, więc zgłasza błąd. Twoja odpowiedź jest prawidłowa, dodatkowe ()stanowią problem, ale opis problemu jest nieprawidłowy (nie jest to błąd składniowy, a przynajmniej nie dla parsera).
— Felix Kling

Nie, przepraszam, o tym mówiłem w poprzednim komentarzu; że nie jest to problem błędu składniowego, ponieważ składnia jest poprawna, ale raczej problem z plikiem skryptu jQuery, który nie został załadowany w momencie użycia $ .ajax ().
— Jason Evans,

2
Nie, nie brakuje pliku jquery.js (gdyby to był błąd, dotyczyłby $), ale nie jest to również błąd składniowy, ponieważ jest to prawidłowy JS. Po prostu nie jest to odpowiednia składnia dla pożądanego zachowania, więc powoduje błąd w czasie wykonywania, jak wyjaśnił Felix.
— nnnnnn

9

Kasa Dokumentacja Jquery

Uwaga dotycząca wycofania: wywołania zwrotne jqXHR.success (), jqXHR.error () i jqXHR.complete () są usuwane od wersji jQuery 3.0. Zamiast tego możesz użyć jqXHR.done (), jqXHR.fail () i jqXHR.always ().


3
To nie ma znaczenia dla kwestii wcale, żadna z tych metod są nieaktualne w użytku z tym pytaniem ..
— Kevin B

3

Wystąpił błąd w funkcji AJAX, za dużo nawiasów, spróbuj zamiast tego $.ajax({


3

Odwołaj się do min wersji jquery, która obejmuje ajax:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

2

Wystąpił błąd składniowy, ponieważ wstawiono nawias po funkcji ajax i inny zestaw nawiasów, aby zdefiniować listę argumentów: -

Jak napisałeś:

$.ajax() ({
    type: 'POST',
    url: url,
    data: postedData,
    dataType: 'json',
    success: callback
});

Nawias wokół ajax musi zostać usunięty powinien być: -

$.ajax({
    type: 'POST',
    url: url,
    data: postedData,
    dataType: 'json',
    success: callback
});

1

Napotkałem to samo pytanie, a moim rozwiązaniem było: dodaj skrypt JQuery.

Szczególnie powinniśmy upewnić się, że odpowiednie JQuery jest załadowane, gdy debugujemy nasze pliki js pod firefox / chrome.


1

Jeśli używasz szablonu HTML Bootstrap, pamiętaj o usunięciu łącza do JQuery Slim na dole szablonu. Publikuję ten szczegół tutaj, ponieważ nie mogę jeszcze komentować odpowiedzi ..


0

Dla każdego, kto próbuje uruchomić to w nodejs : To nie będzie działać po wyjęciu z pudełka, ponieważ jquery potrzebuje przeglądarki (lub podobnej)! Właśnie próbowałem uruchomić import i logowałem, console.log($)który napisał, [Function]a następnie console.log($.ajax)który zwrócił undefined. Nie miałem tscbłędów i miałem autouzupełnianie od intellij, więc zastanawiałem się, co się dzieje.

W pewnym momencie zdałem sobie sprawę, że to nodemoże być problem, a nie maszynopis. Próbowałem tego samego kodu w przeglądarce i działało. Aby działało, musisz uruchomić:

require("jsdom").env("", function(err, window) {
    if (err) {
        console.error(err);
        return;
    }

    var $ = require("jquery")(window);
});

(kredyty: https://stackoverflow.com/a/4129032/3022127 )


-1

Na odpowiedź jest już za późno, ale odpowiedź ta może być pomocna dla przyszłych czytelników.

Chciałbym podzielić się scenariuszem, w którym powiedzmy, że istnieje wiele plików HTML ( jeden podstawowy HTML i wiele pod HTML ), a $ .ajax jest używany w jednym z pod HTML.

Załóżmy, że w sub-HTML, js jest zawarty poprzez URL „ https://code.jquery.com/jquery-3.5.0.js ” oraz w podstawowym / nadrzędnym HTML, poprzez URL - „ https: //code.jquery .com / jquery-3.1.1.slim.min.js ”, wówczas na wszystkich stronach, które używają tego sub-HTML, a także podstawowego HTML wspomnianego powyżej, będzie używana smukła wersja JS.

Jest to szczególnie prawdziwe w przypadku korzystania z frameworka bootstrap, który ładuje js przy użyciu „ https://code.jquery.com/jquery-3.1.1.slim.min.js ”.

Aby rozwiązać problem, należy upewnić się, że na wszystkich stronach plik js jest zawarty za pośrednictwem adresu URL „ https://code.jquery.com/jquery-3.5.0.js ” lub dowolnego innego najnowszego adresu URL zawierającego wszystkie biblioteki JQuery.

Dzięki Lily H. za skierowanie mnie do tej odpowiedzi.


-2

Pozwól, że podzielę się swoim doświadczeniem:

mój projektant stron HTML:

<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>

kiedy tworzę proste żądanie AJAX, pojawia się komunikat o błędzie: TypeError: $ .ajax (…) nie jest funkcją

Dodam więc:

<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>

to przynajmniej działa dla mnie idealnie.


Nie. Ładowanie jQuery slim, a następnie natychmiastowe zastąpienie go jQuery jest całkowicie bezcelowe i marnuje przepustowość.
— Quentin
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.