jQuery：データが条件付きでAJAX経由でリクエストされた場合の返信方法

Question

私はデータを取得するために別の関数を呼び出す関数を持っています。そのデータはローカルにキャッシュされている可能性があります。または、取得する必要があります。ローカルキャッシュは簡単です。しかし、もし私が$ .getJSONを使って、asyncをオフにしてブラウザをロックせずに取得すれば、そのデータを元の関数に戻す方法はありますか？

次のコード、すなわち、：

1）バーので（）はもはやDATAXが起こっているparseData（）戻り、存在しませんか？ 2）bar（）とparseData（）の両方がコールし、リクエストが進行中にブラウザをロックせずにもう1つのコールバック層を持たない場合、dataXをparseData（）からfoo（）に戻すにはどうすればよいですか？ ？

var foo = function() { 

    $('body').text(bar()); 

}; 

var bar = function() { 

    var parseData = function (dataX) { 
     // do something to data 
     return dataX; 
    }; 

    if (localStorage.hasOwnProperty('someKey')) { 
     return localStorage.getItem('someKey'); 
    else { 
     $.getJSON('http://somewhere.api.com?fubar=good', parseData); 
    } 

}; 

Answer 1

あなたが返すことができない。

あなたが実際に要素の.text()関数を呼び出すのテキストを変更し、parseData機能を持つようにしたい要素に渡すためにあなたのコードの流れを変えることができます非同期呼び出し。だけではなく、コールバックとしてのfooを呼び出す：

var foo = function (text) { 

    $('body').text(text); 

}; 

var bar = function() { 

    var parseData = function (dataX) { 
        // do something to data 
        foo(dataX.someText); 
    }; 

    if (localStorage.hasOwnProperty('someKey')) { 
        foo(localStorage.getItem('someKey')); 
    else { 
        $.getJSON('http://somewhere.api.com?fubar=good', parseData); 
    } 

}; 

Answer 2

ので（リターンがテキストではないので）任意のテキストを設定しませんtext() jQueryの機能でそれを直接呼び出すbar関数からの戻りはありません。作るとき

var foo = function() { 

    //here we call the `bar` function and pass the element we want to change the text of as an argument 
    bar('body'); 

}; 

var bar = function (element_str) { 

    //here we use the argument we passed to create a jQuery object of the element to use later 
    var $element = $(element_str); 

    var parseData = function (dataX) { 

     //instead of trying to return the value from the server, we just set the text of the element passed in 
     $element.text(dataX); 
    }; 

    if (localStorage.hasOwnProperty('someKey')) { 

     //here we manually call the `parseData` function to add the locally stored string to the DOM 
     parseData(localStorage.getItem('someKey')); 
    else { 

     //here we pass the `parseData` function as the callback function for this AJAX call so it can set the text in the DOM when the AJAX function has come back successfully 
     $.getJSON('http://somewhere.api.com?fubar=good', parseData); 
    } 

}; 

Answer 3

これは、あなたが要求同期を行うことができ、その場合にはサポートのCORSを、要求しているサーバーがない限り、非同期であること要求することが可能であることを行っていません。私はそれが原因で発生するかもしれない悪いブラウザの経験のためにそれを行うことをお勧めしません。

barは、完了時にアクションを実行するために使用できるコールバックを受け入れることをお勧めします。

編集：ブラウザがのlocalStorageをサポートしていないとどうなります

var foo = function() { 

    $('body').text(bar()); 

}; 

var bar = function() { 

    var parseData = function (dataX) { 
     // do something to data 
     localStorage.setItem('someKey',dataX); 
     foo(); 
    }; 

    if (localStorage.hasOwnProperty('someKey')) { 
     return localStorage.getItem('someKey'); 
    else { 
     $.getJSON('http://somewhere.api.com?fubar=good', parseData); 
     return "loading..."; 
    } 

}; 

：

これを試してみてください？またはこれらのブラウザをターゲットにしていないだけですか？