2

JSON を取得し、そのオブジェクトにアクセスしてデータを取得しようとしています。パスはすべて正常に機能しているように見えますが、具体的には機能していません。確認したところ、パスはアクセスしようとしている他のオブジェクトと同じです。コンソールでは、結果として未定義のままになります。コードの何が問題なのか教えていただければ幸いです。JSON 構造と Java Script を残します。皆さんが私を理解するのを手伝ってくれることを願っています。また、私のコーディングに関するヒントを教えていただければ幸いです。学んでいるからです。

Java Script: この関数は、リスト内の項目をクリックすると呼び出されます。

function checkUser(){
    console.log("clicked");
    var user = $(this).html();
    $.getJSON("js/options.json", function(json){
        var itemsLength = json.chat.OnlineContacts.length;
        for ( var i = 0; i < itemsLength; i++) {
            var jsonUserName = json.chat.OnlineContacts[i].name;
            var jsonUserStatus = json.chat.OnlineContacts[i].status;
            var jsonUserAvatar = json.chat.OnlineContacts[i].avatar;
            if(user == jsonUserName){
                /*displayChatWindow(jsonUserName, jsonUserStatus, jsonUserAvatar);*/
                console.log(jsonUserAvatar);
             }
         };
    });
}

function displayChatWindow(user, status, avatar){
    /*var template = _.template($("#windowTemplate").html(), {userName: user, userStatus: status, userAvatar: avatar});
    $("body").prepend(template);*/
    $(".messages-container").slimScroll({
        height: '200',
        size: '10px',
        position: 'right',
        color: '#535a61',
        alwaysVisible: false,
        distance: '0',
        railVisible: true,
            railColor: '#222',
        railOpacity: 0.3,
        wheelStep: 10,
        disableFadeOut: false,
        start: "bottom"     
    });
}

これが JSON です。

{
"chat": {
    "NumberOfOnlineContacts": "7",
    "NumberOfOfflineContacts": "800",
    "OnlineContacts": [
        {
            "name": "Nandy Torres",
            "status": "online",
            "avatar": "img/profile-picture2.jpg"
        },
        {
            "name": "Catherine Varela",
            "status": "Busy",
            "avatar": "img/profile-picture3.jpg"
        },
        {
            "name": "Jhonnatan Gonzalez",
            "status": "online",
            "avatar": "img/profile-picture4.jpg"
        },
        {
            "name": "Juan Prieto",
            "status": "away",
            "avatar": "img/profile-picture5.jpg"
        },
        {
            "name": "Alexander Barranco",
            "status": "Busy",
            "avatar": "img/profile-picture6.jpg"
        }
    ],
    "OfflineContacts": [
        {
            "name": "Nandy Torres"
        },
        {
            "name": "Catherine Varela"
        },
        {
            "name": "Jhonnatan Gonzalez"
        },
        {
            "name": "Juan Prieto"
        },
        {
            "name": "Jhonathan Sanchez"
        }
    ]
}
}

例のようにアバターでコンソールログを実行しようとすると、未定義になりますが、名前またはステータスの console.log を実行すると、正しい値が取得されます。

4

2 に答える 2

2

Jhonnatan、コードが機能してよかったです。したがって、これは元の質問に対する「答え」ではありません。しかし、コーディングとそれを改善する方法についてのヒントも求められました。コードを改善する方法を探しているのは素晴らしいことです。

checkUser()これは、関数を作成するためのより簡単な方法です。これは、同じデータ形式で機能する関数の直接変換にすぎません。

function checkUser() {
    console.log( "clicked" );
    var user = $(this).html();
    $.getJSON( "js/options.json", function( json ) {
        $.each( json.chat.OnlineContacts, function( i, contact ) {
            if( user == contact.name ) {
                displayChatWindow( contact.name, contact.status, contact.avatar );
                console.log( contact.avatar );
             }
         });
    });
}

オブジェクトを使用すると、これらすべての変数contactを作成する必要がなくなることに注意してください。jsonUserXxxxcontact.avatarjsonUserAvatar

また、JSON データをどのように構造化するのが最善かという問題をより戦略的に検討するために、@DaveRomero の優れた回答を強くお勧めします。

関連資料:この質問への回答として本日投稿した、JSON 再構築に関するこのディスカッション。

于 2013-06-06T21:17:57.953 に答える