TypeError: $ .ajax (…) não é uma função?

Estou tentando criar uma solicitação AJAX simples que retorna alguns dados de um banco de dados MySQL. Aqui está a minha função abaixo:

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

... e é aqui que eu chamo, analisando os parâmetros necessários:

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

No entanto, meu retorno de chamada de sucesso não é executado (como "sucesso!" Não é registrado no console) e recebo um erro no meu console:

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

O que isto significa? Já fiz solicitações AJAX antes de o evento de sucesso disparar uma função anônima dentro de $ .ajax, mas agora estou tentando executar uma função nomeada separada (neste caso, um retorno de chamada). Como faço para fazer isso?

Nenhuma das respostas aqui me ajudou. O problema era: eu estava usando a versão compacta do jQuery , que tinha algumas coisas removidas, sendo o ajax uma delas.

A solução: basta baixar a versão regular (compactada ou não) do jQuery aqui e incluí-la no seu projeto.

Verifique se você está usando a versão completa do jquery e não uma versão slim.

Eu estava usando o link jquery cdn-script que acompanha o jquery. O problema é que este, por padrão, é slim.jquery.js, que não possui a ajaxfunção. Portanto, se você estiver usando o link de script jquery da versão slim (copiada e colada no site do Bootstrap), use a versão completa.

Ou seja, use em <script src="https://code.jquery.com/jquery-3.1.1.min.js"> vez de <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"

Não tenho certeza, mas parece que você tem um erro de sintaxe no seu código. Experimentar:

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

Você tinha colchetes extras ao lado dos $.ajaxquais não eram necessários. Se você ainda receber o erro, o arquivo de script jQuery não será carregado.

Caixa A documentação do jQuery

Aviso de descontinuação : Os retornos de chamada jqXHR.success (), jqXHR.error () e jqXHR.complete () são removidos a partir do jQuery 3.0. Você pode usar jqXHR.done (), jqXHR.fail () e jqXHR.always ().

Você tem um erro na sua função AJAX, entre parênteses demais, tente $.ajax({

Consulte a versão min do jquery que inclui o ajax:

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

Há um erro de sintaxe quando você colocou parênteses após a função ajax e outro conjunto de parênteses para definir a lista de argumentos: -

Como você escreveu: -

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

Os parênteses em torno do ajax devem ser removidos e devem ser: -

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

Encontrei a mesma pergunta e minha solução foi: adicione o script JQuery.

Especialmente, devemos garantir que o JQuery correspondente seja carregado quando depurarmos nossos js no firefox / chrome.

Se você estiver usando o modelo html de bootstrap, lembre-se de remover o link para jquery slim na parte inferior do modelo. Eu posto esses detalhes aqui, pois ainda não posso comentar as respostas.

Para qualquer pessoa que tente executar isso no nodejs : Não funcionará imediatamente , pois o jquery precisa de um navegador (ou similar)! Eu estava apenas tentando executar a importação e estava registrando o console.log($)que escreveu [Function]e depois o console.log($.ajax)que retornou undefined. Eu não tinha tscerros e tinha preenchido automaticamente a partir do intellij, então fiquei imaginando o que estava acontecendo.

Então, em algum momento, percebi que esse nodepoderia ser o problema e não o texto datilografado. Eu tentei o mesmo código no navegador e funcionou. Para fazê-lo funcionar, você precisa executar:

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

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

(créditos: https://stackoverflow.com/a/4129032/3022127 )

É tarde demais para uma resposta, mas essa resposta pode ser útil para futuros leitores.

Gostaria de compartilhar um cenário em que, digamos, há vários arquivos html ( um html base e vários sub-HTMLs ) e $ .ajax está sendo usado em um dos sub-HTMLs.

Suponha que no sub-HTML, js seja incluído na URL " https://code.jquery.com/jquery-3.5.0.js " e no HTML base / pai, na URL - " https: //code.jquery .com / jquery-3.1.1.slim.min.js ", a versão reduzida do JS será usada em todas as páginas que usam esse sub-HTML, bem como no HTML básico mencionado acima.

Isso é especialmente verdade no caso de usar a estrutura de autoinicialização que carrega js usando " https://code.jquery.com/jquery-3.1.1.slim.min.js ".

Portanto, para resolver o problema, é necessário garantir que, em todas as páginas, js seja incluído via URL " https://code.jquery.com/jquery-3.5.0.js " ou seja qual for o URL mais recente que contém todas as bibliotecas JQuery.

Agradeço a Lily H. por me indicar essa resposta.

deixe-me compartilhar minha experiência:

meu designer de página html usa:

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

quando crio uma solicitação AJAX simples, obtendo um erro dizendo: TypeError: $ .ajax (…) não é uma função

Então, eu adiciono:

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

então, funciona perfeitamente para mim, pelo menos.