0

我有以下代码：

<!DOCTYPE html>
<html lang="en">
    <head>

        <title>HTML</title>

        <script src="http://code.jquery.com/jquery-latest.min.js"></script>

        <script>
            $(document).ready(function() {

                $("#b1").click(function(event) {

                    var pm_url = 'http://www.flickr.com/services/rest/?method=flickr.test.echo&format=json&jsoncallback=wooYay&api_key=52c5c9441e7965eb55b7e54246bc6abf';

                    $.ajax({
                        url : pm_url,
                        dataType : 'jsonp',
                        jsonpCallback : 'wooYay',
                        jsonp : 'callback',
                    });

                function wooYay(data) {
                    alert(data);
                    console.log('hi');
                };  

                });

            });
        </script>
    </head>

    <body>
        <div>
            <button id="b1">
                Click Me!
            </button>
        </div>
        <div class="results"></div>

    </body>
</html>

当我在 Google Chrome 开发工具中查看此内容时，我清楚地看到如下响应：

wooYay({"method":{"_content":"flickr.test.echo"}, "format":{"_content":"json"}, "jsoncallback":{"_content":"wooYay"}, "api_key":{"_content":"52c5c9441e7965eb55b7e54246bc6abf"}, "callback":{"_content":"wooYay"}, "_":{"_content":"1357519661919"}, "stat":"ok"})

但不知何故，函数 wooYay 永远不会执行。另外我想将函数 wooYay 保留在代码块中。有人可以告诉我错误在哪里吗？

谢谢，吉姆

4

3 回答 3

1

wooYay不会全局公开，因为它是在匿名函数中定义的。你可以这样分配它...

window.wooYay = function(data) { };
于 2013-01-07T00:58:22.587 回答
1

这是根本不可能的。
wooYay()在全局范围内不可见。

你应该getJSON()正常使用。

于 2013-01-07T00:58:31.697 回答
1

最大的问题是您jsonCallback对 AJAX 成功回调感到困惑。

其中wooYay的jsonCallback内容是为您在发布的响应数据中看到的响应定义包装器。

jQuery 还使用提供的名称或它创建的名称（如果您不提供名称）解开此包装器中包含的数据

但是，这不会运行您命名的函数wooYay。这需要在 $.ajax 的成功回调中运行。

尽管wooYay在 clcik 处理程序中定义函数是非正统的，但它的工作方式如下：

$("#b1").click(function (event) {

  var pm_url = 'http://www.flickr.com/services/rest/?method=flickr.test.echo&format=json&jsoncallback=wooYay&api_key=52c5c9441e7965eb55b7e54246bc6abf';

  $.ajax({
    url: pm_url,
    dataType: 'jsonp',
    jsonpCallback: 'wooYay',
    jsonp: 'callback',
     /* added success callback*/
    success: wooYay
  });

  function wooYay(data) {
    alert('See data in console');
    console.log(data);
  };

});

演示：http: //jsfiddle.net/kT6dq/

重构版本以最大程度地减少wooYay混淆

function responseHandler(data) {
   alert('See data in console');
   console.log(data);
 };   


 $("#b1").click(function (event) {
   var pm_url = 'http://www.flickr.com/services/rest/?method=flickr.test.echo&format=json&jsoncallback=wooYay&api_key=52c5c9441e7965eb55b7e54246bc6abf';

   $.ajax({
     url: pm_url,
     dataType: 'jsonp',
     jsonpCallback: 'wooYay',
     jsonp: 'callback',
     success: responseHandler
   });
 });

演示（重构代码） http://jsfiddle.net/kT6dq/1/

于 2013-01-07T01:19:02.667 回答