JQuery 问题“TypeError：$.getJSON 不是函数”答案

【问题标题】：JQuery issue "TypeError: $.getJSON is not a function"JQuery 问题“TypeError：$.getJSON 不是函数”
【发布时间】：2016-11-15 01:01:11
【问题描述】：

我有这段代码：

$(document).ready(function () {
    $.getJSON('http://localhost:5000/', function (response) {
        console.log(response);
    });
});

localhost:5000 是一个flask/python 脚本，它返回一个json，例如：

{
  "data": [
    0, 
    0, 
    0,

我得到：

$.getJSON is not a function TypeError: $.getJSON is not a function

有什么技巧可以让我开始解开滚球吗？

谢谢！

编辑：

HTML：

<!DOCTYPE html>
<html>

<head>
    <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script>
    <script src="lib/main.js"></script>
</head>

<body>
</body>

</html>

lib/main.js 是document.ready 所在的位置。

谢谢！

【问题讨论】：

您的页面上加载了哪些脚本？你要么不包括jQuery，要么在此之前的某个时间点调用了jQuery.noConflict()（这意味着从那时起你必须使用jQuery而不是$。
如果他没有加载 jQuery，他会在 $(document) 上得到一个错误（$ not found 或其他东西）...所以它可能是 noConflict...
你的 html 没有检测到你的 jquery 库
@GabrielA.Zorrilla 请在下面的答案中查看我的建议。

标签： javascript jquery slim-jquery

【解决方案1】：

您似乎使用的是jquery 的slim 版本，它没有getJSON 方法，这就是您收到此错误的原因。

请使用以下链接中的完整版jquery。

https://code.jquery.com/jquery-3.1.1.min.js

Slim 版本的jquery 不包括ajax、animations effects 等

【讨论】：

【解决方案2】：

在将代码库从 jQuery v1.x+ 迁移到 v3.0+ 时，通常会发生这种情况，因为 jQuery 更新/弃用/停止了它的一些 API。

我建议使用 jQuery Migrate 来解决这个问题以及其他问题：

通过 CDN 在此处获取：

https://cdnjs.com/libraries/jquery-migrate

如果使用 Gulp/Grunt，您可以使用

导入到您的项目中

npm install --save jquery jquery-migrate

Github 存储库 - https://github.com/jquery/jquery-migrate

阅读更多关于 jQuery v3.0+.. http://blog.jquery.com/2016/06/09/jquery-3-0-final-released/

【讨论】：

是的。当我从 jQuery v1.x+ 升级到 v3.0+ 时，遇到了许多不推荐使用的调用：$.getJSON(...snip...).success() 现在是 .done()，.error() 现在是 .fail ()，而 .complete() 现在是 .always()

【解决方案3】：

function cinta(){
$.getJSON('http://localhost:5000/', function (response) {
        console.log(response);
    });
}
cinta();
$(document).ready(function () {
  console.log('yesss');  
});

这在 python 烧瓶中为我工作

【讨论】：

【解决方案4】：

您还可以将Fetch 与async 和await 一起使用：

async function getData(){
  const response = await fetch( "http://localhost:5000/"
);
  return response.json();
}


getData().then((data) => {
//... your code
})

Live demo

【讨论】：