分类导航

jQuery 发布时间：2022-04-19 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了jquery – 尝试访问stackoverflow api但得到解析错误，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

在尝试使用带有ajax和 jquery的stackoverflow api时,我无法让它工作.我知道我必须使用jsonp作为数据类型,并且我一直在阅读执行jsonp请求的不同方法,但我仍然无法使其工作.

这是我的ajax请求：

var API_KEY = "XXXXXXXXXXXX";
var URL = "http://api.stackoverflow.com/1.1/";

var _url = URL + 'users?filter=locrizak';

$.ajax({
    dataType:'jsonp',jsonp : false,jsonpCallBACk : "onJsonp",url: _url,success: function(val) {
            console.log('success');
        //console.log(val);
    },error: function(val) {
        console.log('error');
        console.log(arguments);

    }
});

function onJsonp() {
    console.log(arguments);
};

无论我尝试什么,我总是在萤火虫中得到这样的回应：

“parserError”“onJsonp未被调用”

我知道我正在做一些非常愚蠢的事情,因为我在尝试使用Twitter api时遇到了同样的问题,但我不能为我的生活记住我为了让它工作而做了什么.

更新

所以我采取了一个loog @ genesis的工作演示并尝试了几次和不同的方式,但没有运气.然后我注意到我的jQuery版本并将其切换到他正在使用的那个并且神奇地工作了.

我更改了最新版本
http://code.jquery.com/jquery-1.6.2.min.js
至
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js

嗯不知道它为什么会起作用,可能是一个错误,但谁知道也许有别的东西改变了.

如果你能解释的话,有人知道为什么它会很棒.此外,我意识到jQuery会自动添加回调,但我无法让它像那样工作.我能做些什么才能让这个工作,我猜你会说“更合适”的方式？

var URL = "http://api.stackoverflow.com/1.1/";
api.get(URL + 'users?filter=locrizak');
api.get = function(url) {
    $.ajax({
        /*dataType:'jsonp',*/
        dataType:'json',url: url + '&jsonp=api.onJsonp',success: function(val) {
            console.log('success');
            //console.log(val);
        },error: function(val) {
            //error gets called but.......
            console.log(arguments);
            console.log('error');
            console.log(val);
        }
    });

};
api.onJsonp = function() {
    //so does the callBACk!!  
    console.log('called');
    console.log(arguments);
}
//note this code is simplified

@L_616_7@

您可以将jsonp：’jsonp’添加到 ajax()调用中. stackoverflow API documentation声明它需要jsonp查询参数和jQuery属性来配置传递的查询字符串参数称为jsonp.没有它,默认是添加回调=？到URL的末尾.

我在控制台中获得成功,运行：

var URL = "http://api.stackoverflow.com/1.1/";
var _url = URL + 'users?filter=locrizak';

$.ajax({
    dataType: 'jsonp',jsonp: 'jsonp',// <--- add this
    url: _url,success: function(val) {
       console.log('success');
    },error: function(val) {
        console.log('error');
        console.log(arguments);
    }
});

另外,jsonp：false,不应该设置为false;它必须为true,否则不添加任何查询字符串参数.

更新：使用jQuery v1.6.2并使用上面原始答案中描述的正确参数使其正常工作.回调函数必须在jQuery匿名函数之外.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>JSONP Test</title>
    <Meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function(){
            $.ajax({
                dataType:'jsonp',jsonpCallBACk: 'onJsonp',url: 'http://api.stackoverflow.com/1.1/users?filter=locrizak',success: function(data) {
                    console.log('success',data);
                },error: function(data) {
                    console.log('error',data);
                }
            });
        });

        function onJsonp(data) {
            console.log('callBACk',data);
        };
    </script>
</head><body></body></html>

更新2：根据评论,这是另一个版本,这次包装在一个对象中.请注意,您不能使用jsonpCallBACk：’api.onJsonp’,因为这只是在jQuery匿名函数中定义的.保持封装的最简单方法是创建一个全局函数,并将控制权传递给api对应物.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>JSONP Test</title>
    <Meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function(){
            api = {
                get: function(url) {
                    var URL = "http://api.stackoverflow.com/1.1/";
                    $.ajax({
                        dataType: 'jsonp',url: URL + url,success: function(data) {
                            console.log('success',data);
                        },error: function(data) {
                            console.log('error',data);
                        }
                    });
                },onJsonp: function(data) {
                    console.log('callBACk',data);
                }
            }

            api.get('users?filter=locrizak');
        });

        function onJsonp(data) {
            api.onJsonp(data);
        }
    </script>
</head><body></body></html>