0

両方にリストを含む2つの折りたたみ可能なdivがあります。各リストは、JSON 情報を動的に表示することになっています。私は次のHTMLを持っています:

<body>
    <div data-role="collapsible-set" data-theme="c" id="set">
        <div data-collapsed="true" data-role="collapsible" data-theme="b" id="trip1">
            <h3>Trip 1</h3>
            <ul data-role="listview" id="info1">
                <li>Name 1</li>
            </ul>
        </div>
        <div data-collapsed="true" data-role="collapsible" data-theme="b" id="trip2">
            <h3>Trip 2</h3>
            <ul data-role="listview" id="info2">
                <li>Name 2</li>
            </ul>
        </div>
    </div>
</body>

および次のスクリプト:

<script>
    $(function() {
        $('#trips').collapsible();
    });
    $.getJSON('http://141.219.205.44:8080/json/trip/list', function(data) {

        for ( var i = 0; i < 2; i++) {
             $('#info1 ul').append('<li>' + data[i].name + '</li>').listview('refresh');
        }

</script>

JSONデータを正常に取得できることはわかっていますが、!に追加することはできません。

4

1 に答える 1

0

$('#info1 ul')存在しない #info1 という名前の要素を見つけようとしており、その中に ul が含まれています。ul を削除すると、ul#info1.

データオブジェクトはどのように見えますか? データにその数の項目があると確信していますか (0-1)?

DOM が読み込まれたことを確認するために、dom-ready メソッドの周りにも getJSON を追加します。

$(function() {
    $('#trips').collapsible();
    $.getJSON('http://141.219.205.44:8080/json/trip/list', function(data) {
        for ( var i = 0;l=data.length; i < l; i++) {
            $('#info1').append('<li>' + data[i].name + '</li>').listview('refresh');
        }
    }
});
于 2012-11-13T08:23:13.193 に答える