1

下のリンクをクリックして私がこれまでに持っているもののソースを見ると、私が抱えている問題がわかります。

  • ゲームデータを含むRicky.jsonからJSONデータをフェッチします。
  • 次に、そのJSONデータの一部を使用して、テキストフィールドにピカチュウの名前を設定しようとしましたが、代わりに、それがであると表示されundefinedます。

Chromeのコンソールに、オブジェクト「pikachu」が存在すると表示されます。これは、コンソールでアラートを送信すると、「オブジェクトオブジェクト」で返されるためです。JSON.stringify（）を使用してコンソールから文字列化することもできます。

main()機能自体はグローバルではないのに、他のどこでもグローバルなのはなぜですか？

ピカチュウを育てる

function ChangeName(){
    var n=prompt("What would you like to rename your Pikachu?",""+pikachu.pikaname+"");
    pikachu.pikaname=n;
}

function main(){
    try{
        ajaxObj=new XMLHttpRequest();
        pikaname=document.getElementById("pikaname");
        age=document.getElementById("age");pikachu="";
        ajaxObj.onreadystatechange=function(){
            if(ajaxObj.readyState>=4&&ajaxObj.status==200){
                pikachu=JSON.parse(ajaxObj.responseText);
            }
        }
        ajaxObj.open("GET","players/Ricky.json",true);
        ajaxObj.send();
        pikaname.value=pikachu.pikaname;
    }
    catch(e){
        alert(e);
    }
}
4

2 に答える 2

3

AJAX 呼び出しは非同期で実行されます。行が実行された時点ではpikaname.value = pikachu.pikaname;、JSON は実際にはまだ利用可能ではありません。onreadystatechange代わりに、イベント内で設定する必要があります。

    ajaxObj.onreadystatechange=function(){
        if(ajaxObj.readyState>=4&&ajaxObj.status==200){
            pikachu=JSON.parse(ajaxObj.responseText);
            // Set the value in the onreadystatechange...
            pikaname.value = pikachu.pikaname;
        }
    }

pikanameここで、なしで定義されたグローバルとしておそらく依存すべきではないことも指摘しますvar。代わりに、var関数の外側で定義するか、それを取得して、それvarを使用する関数の内側で定義します。

// Define at global scope
var pikachu;
function ChangeName(){
    var n=prompt("What would you like to rename your Pikachu?",""+pikachu.pikaname+"");
    pikachu.pikaname=n;
}

function main(){
    try{
        // Define with var in this function
        var ajaxObj=new XMLHttpRequest();
        var pikaname=document.getElementById("pikaname");
        var age=document.getElementById("age");
        pikachu="";

        ajaxObj.onreadystatechange=function(){
            if(ajaxObj.readyState>=4&&ajaxObj.status==200){
                pikachu=JSON.parse(ajaxObj.responseText);
            }
        }
        ajaxObj.open("GET","players/Ricky.json",true);
        ajaxObj.send();
        pikaname.value=pikachu.pikaname;
    }
    catch(e){
        alert(e);
    }
}
于 2012-07-29T00:17:42.997 に答える
0

あなたの問題はここにあるようです：

   age=document.getElementById("age");pikachu="";
    ajaxObj.onreadystatechange=function(){
        if(ajaxObj.readyState>=4&&ajaxObj.status==200){
            pikachu=JSON.parse(ajaxObj.responseText);
        }
    }
    ajaxObj.open("GET","players/Ricky.json",true);
    ajaxObj.send();
    pikaname.value=pikachu.pikaname;

最初の行は、空の文字列を に割り当てますpikachu。(ちなみに、私はそのような行に複数の割り当てを入れません。)

数行後、pikachu非同期呼び出しを介して値を再度割り当てています。しかし、それは非同期です。したがって、プロパティpikachuを持つオブジェクトであると予想される最後の行に到達したときに、割り当てが行われるという保証はありません。pikaname

その時点で、どちらかpikachuがまだ空の文字列である可能性があります。

于 2012-07-29T00:18:43.137 に答える