2012-11-13 19 views
2

我是JavaScript的新手。我想創建一個在初始化時使用Ajax與Flickr Web API進行通信的類。通過ajax獲取json的類初始化總是失敗

Photo2.js

var Photo2; 

    Photo2 = (function() { 

    Photo2.prototype.json = null; 

    function Photo2() { 
     $.getJSON('http://www.flickr.com/services/rest/?jsoncallback=?', { 
     format: 'json', 
     method: 'flickr.photos.search', 
     api_key: '7965a8bc5a2a88908e8321f3f56c80ea', 
     user_id: '[email protected]', 
     per_page: '100' 
     }, function(data) { 
     this.json = data.photos.photo; 
     }); 
    } 

    return Photo2; 

    })(); 

但是,當作爲photo2 = new Photo2初始化這個沒有photo2.json

謝謝你的好意。

+0

我不使用以上,但與JSON回調,這通常意味着該請求是JSON與填充,這是'格式:「 jsonp''我相信。 – Ohgodwhy

+0

謝謝你的建議。我嘗試了'json'和'jsonp',但都失敗了。 – weed

+0

較新版本的jQuery似乎在使用$ .getJSON獲取JSONP時遇到了一些麻煩。你嘗試過使用$ .ajax嗎? – m90

回答

2

你應該真的重寫你的代碼。要弄清楚你想達到什麼是很複雜和很難的。

首先,從服務器獲取數據是異步的,因此您無法確定在創建Photo2的實例後json屬性將被定義。

接下來的事情是,在初始化對象時調用服務器是非常糟糕的主意。我建議你以下解決方案:

(function() { 
    var Photo2 = function(callback) { 
    this.json = null; 
    }; 

    Photo2.prototype.getData = function(successCallback) { 
    var self = this; 

    $.getJSON('http://www.flickr.com/services/rest/?jsoncallback=?', { 
     format: 'json', 
     method: 'flickr.photos.search', 
     api_key: '7965a8bc5a2a88908e8321f3f56c80ea', 
     user_id: '[email protected]', 
     per_page: '100' 
     }, function(data) { 
     self.json = data.photos.photo; 
     typeof successCallback == 'function' && successCallback(); 
     }); 
    }; 

    var photo = new Photo2(); 
    photo.getData(function successCallback() { 
    console.log('Data loaded', photo.json); 
    }); 
}).call(this); 

工作演示在這裏:http://jsbin.com/ureyas/1/edit

+0

我想了解上面的代碼......順便說一句,你的JSBin工具非常吸引人! – weed

+0

@weed:它不是我的:)但我真的建議你在共享JS代碼時使用它。如果您有其他問題,請隨時在此處詢問。 – dreame4