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

最大の問題はjsonCallback、AJAX成功コールバックと混同していることです。

のwooYayは、jsonCallback投稿した応答データに表示される応答のラッパーを定義するためのものです。

jQueryはまた、提供された名前、または提供されていない場合は作成した名前を使用して、このラッパーに含まれるデータをアンラップします

ただし、これは指定した関数を実行しませんwooYay。これは、$。ajaxの成功コールバックで実行する必要があります。

wooYayclcikハンドラー内で関数を定義することは非正統的ですが、次のように機能します。

$("#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 に答える
1

wooYay無名関数で定義されているため、グローバルに公開されません。あなたはそれをそのように割り当てることができます...

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

それは基本的に不可能です。
wooYay()グローバル スコープでは表示されません。

getJSON()普通に使えばいい。

于 2013-01-07T00:58:31.697 に答える