jquery - コールバックでのeBay api jqueryのキャッチされていない参照エラー

Question

私は単純な eBay jQuery プラグインに取り組んでいます。呼び出しに成功します。結果を返します。ただし、コールバック関数を見つけようとすると、「Uncaught ReferenceError: _cb_findItemsByKeywords is not defined」というメッセージが表示されます。

    (function( $ ){

    $.fn.ebay_jQuery = function( options  ) {
        var settings = $.extend({
            rootURL : "http://svcs.ebay.com/services/search/FindingService/v1",
            operationName : "findItemsByKeywords",
            serviceVersion : "1.0.0",
            securityAppName : "myApp",
            globalID : "EBAY-US",
            responseFormat : "JSON",
            callback : "_cb_findItemsByKeywords",
            keywords : "religious%20book",
            entriesPerPage : "20"
        }, options);
        var html = [];
        // Parse the response and build an HTML table to display search results
        var _cb_findItemsByKeywords = function(root) {
            var items = root.findItemsByKeywordsResponse[0].searchResult[0].item || [];

            for (var i = 0; i < items.length; ++i) {
                var item     = items[i];
                var title    = item.title;
                var pic      = item.galleryURL;
                var viewitem = item.viewItemURL;

                if (null != title && null != viewitem) {
                    html.push('<div class="box item-box" style="position: absolute; opacity: 1; top: 0px; left: 240px; ">'+
                        '<div class="item">'+
                        '<div>'+
                        '<div class="goods-pic">'+
                        '<a href="' + viewitem + '" target="_blank">' +
                        '<img src="' + pic + '" border="0">'+
                        '</a>'+
                        '</div>'+
                        '<p class="item-title" style="margin-top: 10px;">'+
                        '<a href="' + viewitem + '" target="_blank">' + title + '</a>'+
                        '</p>'+
                        '<p class="item-price-fee clearfix"><span class="sale-price"> $38.5</span>&nbsp;&nbsp;/&nbsp;&nbsp; <span class="blue">0 bids</span></p>'+
                        '<p class="clearfix"><span class="blue pull-left" style="color: #538dc2;">0 mins left</span></p>'+
                        '<p><span class="blue">Buy it now ($52.5)</span></p>'+
                        '<p><span class="pull-right">Portland, TN</span></p>'+
                        '</div>'+
                        '</div>'+
                        '</div>');
                }
            }
        }

        var constructRequest = function(){
                // Construct the request
                url = settings.rootURL;
                url += "?OPERATION-NAME="+settings.operationName;
                url += "&SERVICE-VERSION="+settings.serviceVersion;
                url += "&SECURITY-APPNAME="+settings.securityAppName;
                url += "&GLOBAL-ID="+settings.globalID;
                url += "&RESPONSE-DATA-FORMAT="+settings.responseFormat;
                url += "&callback=_cb_findItemsByKeywords";
                url += "&REST-PAYLOAD";
                url += "&keywords="+settings.keywords;
                url += "&paginationInput.entriesPerPage="+settings.entriesPerPage;
                //url += urlfilter;

                return url;
            }
            var submitRequest = function(){
                var url = constructRequest();
                // Submit the request
                s=document.createElement('script'); // create script element
                s.src= url;
                document.body.appendChild(s);
            }


          // End _cb_findItemsByKeywords() function

        return this.each(function() {

            submitRequest();
            $(this).append(html);
        });
    };
})( jQuery );

<html>
<head>
    <title>eBay Search Results</title>
    <script type="text/javascript" src="/js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="/js/ebay_jQuery.js"></script>
    <script>
        $(document).ready(function(){
            $('#results').ebay_jQuery();
        });
    </script>
</head>
<body>
<div id="main-content">
    <div class="container-fluid">
        <div class="row-fluid">
            <div class="span12">
                <div class="item-container clearfix" id="item-container" style="position: relative; height: 1204px; ">

                    <div id="results"></div>

                </div>
            </div>
        </div>
    </div>
</div>

</body>
</html>

score 0 · Accepted Answer

コールバック関数はグローバルスコープで定義されていないため、呼び出し元のスクリプトからアクセスできません。

各コールバックメソッドに一意の名前を付けて、ウィンドウに追加する必要があります。

var uniqueName = "_cb_" + $.now();
window[uniqueName] = function (root) {
    /* your stuff */

    window[uniqueName] = null;
}

次に、その一意の名前を、そのスクリプトの目的のコールバック fn として eBay API に渡します。

score 0 · Accepted Answer

alejoが実際に機能しているという回答が提供されましたが、少し修正します。jQuery ajax 呼び出しは dataType: 'jsonp' をサポートし、'callback=?' を追加します。デフォルトで URL に追加され、コールバック関数を ajax 呼び出しの成功属性として定義できます。data 属性を使用してクエリパラメータを渡すこともできます。

<html>
<head>
<title>eBay Search Results</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">body { font-family: arial,sans-serif;} </style>
<script type="text/javascript">
 $(document).ready(function() {
    $("#ebay").click(function(e){
      var url = "http://svcs.ebay.com/services/search/FindingService/v1?SECURITY-APPNAME=Reddeneg-2a4d-4b23-8d37-defc1bbb868f&OPERATION-NAME=findItemsByKeywords&SERVICE-VERSION=1.0.0&RESPONSE-DATA-FORMAT=JSON&REST-PAYLOAD&paginationInput.entriesPerPage=30";
      $.ajax({
        url: url,
        dataType: "jsonp",
        data: {keywords: 'thermo'},
        success: function(root){
            var items = root.findItemsByKeywordsResponse[0].searchResult[0].item || [];
            var html = [];
            html.push('<table width="100%" border="0" cellspacing="0" cellpadding="3"><tbody>');

            for (var i = 0; i < items.length; ++i)   {
                var item     = items[i];
                var title    = item.title;
                var pic      = item.galleryURL;
                var viewitem = item.viewItemURL;

                if (null != title && null != viewitem) {
                    html.push('<tr><td>' + '<img src="' + pic + '" border="0">' + '</td>' +
                    '<td><a href="' + viewitem + '" target="_blank">' + title + '</a></td></tr>');
                }
            }
            html.push('</tbody></table>');
            document.getElementById("results").innerHTML = html.join("");
        }
        });
    });
 });
    </script>
</head>
<body>
<h1>eBay Search</h1>
<a id="ebay" href="#"> run Ebay Query</a>
<div id="results"></div>
</body>
</html>

jquery - コールバックでのeBay api jqueryのキャッチされていない参照エラー

3 に答える 3

Related

Reference