TypeError: $ .ajax (…) n'est pas une fonction?

J'essaie de créer une simple demande AJAX qui renvoie certaines données d'une base de données MySQL. Voici ma fonction ci-dessous:

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

... et voici où je l'appelle, en analysant les paramètres requis:

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

Pourtant, mon rappel de succès ne s'exécute pas (car "succès!" N'est pas connecté à la console), et j'obtiens une erreur dans ma console:

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

Qu'est-ce que ça veut dire? J'ai déjà fait des requêtes AJAX où l'événement de succès déclenche une fonction anonyme à l'intérieur de $ .ajax, mais maintenant j'essaie d'exécuter une fonction nommée distincte (dans ce cas, un rappel). Comment dois-je procéder?

Aucune des réponses ici ne m'a aidé. Le problème était: j'utilisais la version slim de jQuery , qui avait supprimé certaines choses, ajax étant l'un d'entre eux.

La solution: Il suffit de télécharger la version régulière (compressé ou non) de jQuery ici et l' inclure dans votre projet.

Vérifiez si vous utilisez la version complète de jquery et non une version slim.

J'utilisais le lien jquery cdn-script fourni avec jquery. Le problème est que celui-ci par défaut est slim.jquery.js qui n'a pas la ajaxfonction dedans. Donc, si vous utilisez (copier-coller depuis le site Web de Bootstrap) un lien de script jquery version mince, utilisez plutôt la version complète.

C'est-à-dire utiliser <script src="https://code.jquery.com/jquery-3.1.1.min.js"> au lieu de <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"

Pas sûr, mais il semble que vous ayez une erreur de syntaxe dans votre code. Essayer:

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

Vous aviez des crochets supplémentaires à côté de $.ajaxqui n'étaient pas nécessaires. Si l'erreur persiste, le fichier de script jQuery n'est pas chargé.

Commander la documentation Jquery

Avis de dépréciation: les rappels jqXHR.success (), jqXHR.error () et jqXHR.complete () sont supprimés à partir de jQuery 3.0. Vous pouvez utiliser jqXHR.done (), jqXHR.fail () et jqXHR.always () à la place.

Vous avez une erreur dans votre fonction AJAX, trop de crochets, essayez à la place $.ajax({

Référencez la version jquery min qui inclut ajax:

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

Il y a une erreur de syntaxe car vous avez placé des parenthèses après la fonction ajax et un autre ensemble de parenthèses pour définir la liste des arguments: -

Comme vous l'avez écrit: -

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

La parenthèse autour d'ajax doit être supprimée, elle doit être: -

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

J'ai rencontré la même question, et ma solution était: ajoutez le script JQuery.

Surtout, nous devons nous assurer que la JQuery correspondante est chargée lorsque nous déboguons nos js sous firefox / chrome.

Si vous utilisez un modèle HTML bootstrap, n'oubliez pas de supprimer le lien vers jquery slim au bas du modèle. Je poste ce détail ici car je ne peux pas encore commenter les réponses ..

Pour tous ceux qui essaient de l'exécuter dans nodejs : cela ne fonctionnera pas, car jquery a besoin d'un navigateur (ou similaire)! J'essayais juste de lancer l'importation et je consignais console.log($)qui écrivait [Function]et console.log($.ajax)qui revenait également undefined. Je n'ai eu aucune tscerreur et j'ai eu la saisie semi-automatique de l'intellij, donc je me demandais ce qui se passait.

Puis, à un moment donné, j'ai réalisé que nodec'était peut-être le problème et non la dactylographie. J'ai essayé le même code dans le navigateur et cela a fonctionné. Pour le faire fonctionner, vous devez exécuter:

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

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

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

C'est trop tard pour une réponse mais cette réponse peut être utile pour les futurs lecteurs.

Je voudrais partager un scénario dans lequel, disons, il existe plusieurs fichiers html ( un html de base et plusieurs sous-HTML ) et $ .ajax est utilisé dans l'un des sous-HTML.

Supposons que dans le sous-HTML, js soit inclus via l'URL " https://code.jquery.com/jquery-3.5.0.js " et dans le HTML de base / parent, via l'URL - " https: //code.jquery .com / jquery-3.1.1.slim.min.js ", la version slim de JS sera utilisée sur toutes les pages qui utilisent ce sous-HTML ainsi que le HTML de base mentionné ci-dessus.

Cela est particulièrement vrai dans le cas de l'utilisation du framework bootstrap qui charge js en utilisant " https://code.jquery.com/jquery-3.1.1.slim.min.js ".

Donc, pour résoudre le problème, vous devez vous assurer que dans toutes les pages, js est inclus via l'URL " https://code.jquery.com/jquery-3.5.0.js " ou quelle que soit la dernière URL contenant toutes les bibliothèques JQuery.

Merci à Lily H. de m'avoir pointé vers cette réponse.

permettez-moi de partager mon expérience:

mon utilisation de concepteur de page html:

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

lorsque je crée une simple demande AJAX, obtenant une erreur, il dit, TypeError: $ .ajax (…) n'est pas une fonction

J'ajoute donc:

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

alors, cela fonctionne parfaitement pour moi au moins.