0

次のHTMLコードがあります。内部に折りたたみ可能なリスト項目があるポップアップです。

<div data-role="popup" id="wavelistPopup" class="ui-content">
    <div id="wavlistContainer" data-role="collapsible-set" data-theme="c" data-content-theme="c" data-collapsed-icon="arrow-r" data-expanded-icon="arrow-d" style="margin:0; width:250px;">
        <div data-role="collapsible" data-inset="false">
            <h2>Wave1</h2>
            <ul data-role="listview">
                <li>Entfernung: </li>
                <li>Von Autor:</li>
                <li>Schwierigkeit:</li>
                <li>Beschreibung:</li>
                <li><a data-rel="dialog">Erfahrungsberichte</a></li>
                <li><a data-rel="dialog">Wissenswertes</a></li>
                <li><a data-rel="dialog">&Auml;hnliche Waves</a></li>
            </ul>
            <button>Sync</button>
            <button>L&ouml;schen</button>
        </div><!-- /collapsible -->

    </div><!-- /collapsible set -->
</div><!-- /popup -->

ここで、次のコードを使用して、wavlistcontainer に別の折りたたみ可能なものを追加したいと考えています。そのために、まず ajax 呼び出しを行い、コールバック関数で作業します。

function populateWaveList(){
    console.log("populateWaveList");
    requestWavesInArea(position.position.coords.latitude, position.position.coords.longitude,  
            position.position.coords.latitude+5, position.position.coords.longitude+5, 10, 
            function(waves){ //after AJAX call
            console.log(waves);
                for(var wavei in waves){ // for every element to add
                    var content = "";
                    var wave = waves[wavei];
                    console.log(wave);
                    var content =+ jQuery('somestring';     '<div data-role="collapsible" data-inset="false">'+
                                '<h2>'+wave.name+'</h2>'+
                                '<ul data-role="listView">'+    
                                        '<li>Entfernung von Autor: '+'...'+'</li>'+
                                        '<li>Autor: '+wave.creatorname+'</li>'+
                                        '<li>Beschreibung: '+wave.description+'</li>'+
                                        '<li>Umfang: '+'...'+'</li>'+
                                        '<li>Terrain: '+wave.terrainType+'</li>'+
                                        '<li>Autor: '+wave.creatorname+'</li>'+
                                        '<li>Schwierigkeit: '+wave.difficulty+'</li>'+
                                        '<li>ID: '+wave.waveId+'</li>'+
                                        '<li>Datum: '+wave.created+'</li>'+
                                    '</ul>'+
                                    '<button disabled="disabled">Sync</button>'+
                                    '<button disabled="disabled">L&ouml;schen</button>'+
                                '</div>');
                    console.log(content); // returns 'false'
                    $('#wavelistContainer').append(content);
                }
                $('#wavelistPopup').popup('open', { x : 460, y : 180 });
    });
}

コンテンツを印刷すると、false非常に混乱します。誰でもこれで私を助けてくれますか?

ありがとうございました

4

2 に答える 2

1

2 つの問題:

  • =+の代わりに使用しています+=
  • あなたはすぐにhtmlをjqueryオブジェクトに変換します

この行：

​var content =+ 'somestring';

と同じです

​var content = 0 + 'somestring';

となり、 が生成されNaNます。

それ以外の

content =+  jQuery('<div data-role="collapsible" data-inset="false">'+

行う

content +=  '<div data-role="collapsible" data-inset="false">'+

また、パフォーマンスを向上させるために、文字列を 1 つだけ作成し、それを 1 回だけ追加する必要があることに注意してくださいcontent(ループの前に宣言し、ループの後に追加します)。

于 2012-10-17T15:44:10.790 に答える
1

コードに問題があります

    content =+  jQuery('<div data-role="collapsible" data-inset="false">'+
--------------^-----^
                                    '<h2>'+wave.name+'</h2>'+
                                    '<ul data-role="listView"'>+    
--------------------------------------------------------------^

する必要があります

content +='<div data-role="collapsible" data-inset="false">'+
                                    '<h2>'+wave.name+'</h2>'+
                                    '<ul data-role="listView">'+
于 2012-10-17T15:47:06.933 に答える