如何将JQuery实例方法作为Google API回调发送?

时间:2011-09-20 02:16:23

标签: javascript jquery google-api google-pagespeed

有没有人以前想过如何将(JQuery插件)对象范围的方法作为Google API回调发送?例如。对于PageSpeed API。

所有示例都显示您发送全局函数的名称,但我想以某种方式发送特定的实例方法,(或者重新查找JQuery对象的方法)。

这基于their sample

 var s = document.createElement('script');
 s.type = 'text/javascript';
 s.async = true;
 var query = [
   'url=' + url,
   'callback=runCallbacks',
   'key=' + settings.api_key,
 ].join('&');
 s.src = API_URL + query;
 document.head.insertBefore(s, null);

所以我想实现就像这样的召唤:

 $('div.jq-google-plugin).MyGooglePlugin('callback',result);

我正在我的插件的init方法中设置对Google的调用。

e.g。我尝试了这个 - 但这会产生来自Google API的400 Bad Request。

 var query = [
   'url=' + url,
   'callback='+ encodeURI('function(result){$(\'div.jq-google-plugin\').MyGooglePlugin(\'callback\',result);}’,
   'key=' + settings.api_key,
 ].join('&');

我真的不想要做的是创建一些名称错误的全局只是为了捕获每个插件实例的响应,但我认为这是唯一的方法? (这适用于BTW。)

 var query = [
   'url=' + url,
   'callback=myUniqueGlobalCallback',
   'key=' + settings.api_key,
 ].join('&');
 myUniqueGlobalCallback = function(result){$('div.jq-google-plugin).MyGooglePlugin('callback',result);}

提前感谢任何见解!我想这个解决方案可能不是Google API特有的,但可以解释为什么它拒绝除了全局函数名之外的任何东西。

2 个答案:

答案 0 :(得分:1)

jQuery对JSONP有很好的支持。你应该使用它而不是自己注入脚本元素。有了这个,您甚至不需要关心回调,响应将自动路由到您的success回调。

jQuery.fn.MyGooglePlugin = function() {
    $.ajax('<url>', {
        dataType: 'jsonp',
        data: {
            key: 'api-key'
        }
        success: function(response) {
            console.log(response);
        }
    });
};

答案 1 :(得分:1)

  

我真的不想要做的是创建一些名称错误的全局只是为了捕获每个插件实例的响应,但我认为这是唯一的方法?

这是唯一的方法。这里的问题是你正在做的是一个JSONP调用。这意味着你实际上并没有调用任何javascript。您正在动态地向页面添加新的脚本元素。该脚本元素将立即加载URL中的javascript,javascript将如下所示:

yourCallback({data: "Some Data"});

因为无论yourCallback必须是一个字符串才能使其工作,所以无法传入一个对象。有图书馆支持您正在尝试做的事情,但在幕后,这就是它的工作方式,因为这是它可以工作的唯一方式。