如何在原型javascript中定义jsonp回调

我试图通过javascript生成小部件，从服务器获取结果并显示它

我就是这样做的：

var Widgets = function( element, options ) {

    this.ele = document.getElementById( element );
    this.options = extend({}, this.options);
    extend( this.options, options );
    this._init();
};

Widgets.prototype = {
    options: {
        userKey: 'xxxxxxxxxxxxxxxxxx'
    }, 
    _init: function() {

        // Send request to Server
        this.sendRequestToServer();
    }, 

    sendRequestToServer: function() {

        var script = document.createElement('script');
        script.src = 'http://example.localhost/api/get_widget/'+this.options.userKey+'?callback=onFetchComplete';
        document.getElementsByTagName('head')[0].appendChild(script);
    }, 

    // callback not working
    onFetchComplete: function() {

    }

};

我的问题是

callback=onFetchComplete

，我在中的方法不可通过回调请求调用。我知道当我使用

this.onFetchComplete

调用时，这将起作用。任何人都可以通过相同的原型方法提出正确的方法吗？

试试：

script.src = 'http://example.localhost/api/get_widget/'+this.options.userKey+'?callback=Widgets.onFetchComplete';

我使用以下代码进行了测试：

Widgets = {
    options: {
        userKey: 'xxxxxxxxxxxxxxxxxx'
    }, 
    _init: function() {

        // Send request to Server
        this.sendRequestToServer();
    }, 

    sendRequestToServer: function() {

        var script = document.createElement('script');
        script.src = 'http://api.dribbble.com/players/simplebits?callback=Widgets.onFetchComplete';
        document.getElementsByTagName('head')[0].appendChild(script);
    }, 

    // callback not working
    onFetchComplete: function(data) {
        console.log(data);
    }

};

window.onload = function() {
    var w = Widgets._init();
}

---

浏览器在全局范围内查找回调函数，因此您需要在全局范围内定义

onFetchComplete

。看起来很恶心，但你可以这样做：

sendRequestToServer:function（）{
var script=document.createElement（'script'）；
window.onFetchComplete=this.onFetchComplete；
script.src=http://example.localhost/api/get_widget/“+this.options.userKey+”？callback=onFetchComplete'；
document.getElementsByTagName（'head'）[0].appendChild（脚本）；
}，

---

这是一个快速而肮脏的解决方案，因此您可能希望找到一个更优雅的解决方案来设置处理范围。

您是如何实例化

小部件的

？您知道吗？没有可调用的全局

onFetchComplete

变量。@Bergi这是如何启动

新小部件（“cf_小部件_容器”）

@Bergi prototype是否有其他方法？是和否。您需要找到一种方法为每个请求回调生成唯一的全局标识符。您可以使用实例（如果它已经是一个全局变量）并直接调用原型方法，如

？callback=mywidgets.onFetchComplete

。请注意，调用的

上下文可能不正确。为什么这样做？你到底换了什么？为什么
Widgets
不再是一个函数了？首先，它可以工作，因为我已经将回调函数设置为：Widgets.onFetchComplete，其次，我在创建对象的方式上遇到了一个错误，所以我决定用旧的方式来做。您还应该了解：，prototype用于向已创建的对象添加函数。所以首先需要有Widgets={}；然后你可以做Widgets.prototype.function_name=function（）{}@Tanatos这给了我一个错误，
Widgets.onFetchComplete
不是一个函数，就像我之前得到的那样，
onFetchComplete
不是一个函数。@Tanatos：首先，我不是OP:-）您已经将
Widgets
从“类”完全更改为单实例，这不是您应该拥有的。你对的理解似乎有缺陷。尽管如此，他还是使用了一个
.prototype
，这清楚地表明了构造函数的存在。