1

選択フォームにmobiscrollを使用しており、静的コンテンツを使用する場合は問題ありませんが...

今、ajax/json から動的コンテンツを含む mobiscroll を作成しようとしています。

これが私がやろうとしていることです:

$(document).ready(function(){

    $(function(){

        var all_friends = [];

        $.getJSON('http://mypage.com/json/friends.php', function(data){

            $.each(data, function (i, val) {
                all_friends.push("'1':'<div class='friend'><div class='profileimg'><img src='http://mypage.com/"+val.img+"'/></div><span>"+val.name+"</span></div>'");
            });

            var friendlist = {all_friends}; // THIS IS WHAT GIVES ME TROUBLE. I CANT DO THIS? //

            var wheel = [{}];
            wheel[0]['Choose friend'] = friendlist;

            $('#friends').scroller({
                display: 'bottom',
                mode: 'scroller',
                wheels: wheel,
                theme: 'ios',
                animate: 'fade',
                cancelText: 'Regret',
                setText: 'OK',
                height: 40,
                width: 280,
                formatResult: function(data){
                    return data;
                },
                onSelect: function(textValue, inst){
                    var returnData = textValue.toString();
                    var returnData = returnData.split(',');

                    var friend = returnData[0];

                    $('#friends').html(friend);
                }
            });
        });
    });
});

all_friends 配列は次を返します。

'1':'<div class="friend"><div class="profileimg"><img src="http://mypage.com/someimage.png"/></div><span>Friend1</span></div>',
               '2':'<div class="friend"><div class="profileimg"><img src="http://mypage.com/someimage.png"/></div><span>Friend2</span></div>',
               '3':'<div class="friend"><div class="profileimg"><img src="http://mypage.com/someimage.png"/></div><span>Friend3</span></div>'

フレンドリストの{}括弧内の配列を取得できないようです? 静的な場合の外観は次のとおりです。

var friendlist = {'1':'<div class="friend"><div class="profileimg"><img src="http://mypage.com/someimage.png"/></div><span>Friend1</span></div>',
               '2':'<div class="friend"><div class="profileimg"><img src="http://mypage.com/someimage.png"/></div><span>Friend2</span></div>',
               '3':'<div class="friend"><div class="profileimg"><img src="http://mypage.com/someimage.png"/></div><span>Friend3</span></div>'}

事前に助けと感謝を願っています:-)

4

1 に答える 1

0

次のコードが機能するはずです。

var friendlist = {}

$.each(data, function (i, val) {
   $.extend(friendist, {"1":"<div class='friend'><div class='profileimg'><img src='http://mypage.com/"+val.img+"'/></div><span>"+val.name+"</span></div>'"});
});

// here friendlist will be of the format you expect
于 2013-07-18T04:40:18.223 に答える