3

以下のコードは、Phonegap を使用して JQuery Mobile フレームワークの「ホーム」ページにあるボタンcacheListPrint()の要素から呼び出される関数を示しています。onclick

以下の HTML はhref、「ホーム」ページの要素からロードされるターゲット ページを示しています。

このcacheListPrint()関数は、SQLLite データベースからデータを取得し、それを使用して順序付けられていないリストを動的に作成し、JQueryviewlist要素として入力します。

ページが読み込まれると、ビューリストはフォーマットされず、データベースから取得された各要素のテキスト ヘッダーと画像のみが表示されます。データが表示されており、データベースから要求されたものと一致しているため、リストが正常に作成されていることはわかっていますが、適切にレンダリングできません。

現在参照が行われている場所で$('#placeslist').viewlist();&を使用してみました。どちらも機能しません。また、宣言されている場所のすぐ下の行までステートメントを移動しようとしました。$('#placeslist').viewlist('refresh');.trigger('create').trigger('create')<ul>

さらに、いずれかのviewlist(...)関数を呼び出すと、Eclipse デバッグ ターミナルで次のエラーがスローされます。

Uncaught TypeError: Object [object Object] has no method 'listview'-viewlist未知のメソッド呼び出しであることを明確に示しています。

function cacheListPrint() {
            db.transaction(queryDBPrint, errorCB);

        }

        function queryDBPrint(tx) {
            tx.executeSql('SELECT * FROM cache', [], querySuccessPrint, errorCB);
        }

        function querySuccessPrint(tx, results) {
                $('#placeslistcontainer').empty();
                $('#placeslistcontainer').html('<ul id="placeslist" data-filter="true"></ul>');

                $.each(results.rows, function(index){
                    var row = results.rows.item(index);
                    $("#placeslist").append('<li><a href="#"><h1>'+row['name']+'</h1><img src="'+row['image']+'" /></a></li>');
                });
                $("#cachelist").trigger('create');
        }

        function errorCB(err) {
            alert("Error processing SQL: "+err.code);
}



<div data-role="page" id="cachelist" data-transition="none"> <!-- Start of cache list screen -->
        <header data-role="header">
            <h1>Cache List</h1>
            <a href="#home" data-icon="home" data-transition="none">Home</a>
        </header>
        <div data-role="content" id="placeslistcontainer">

        </div>
        <footer data-role="footer" data-position="fixed">
        </footer>
</div> <!-- End of cache list screen -->

私は JQuery Mobile API をかなり広範囲に読んで、この問題をグーグルで検索するのに何時間も費やしました。「そこにある」提案の多くは、それらを検討すると意味がありますが、実装すると機能しません。私は提案の実装に自信を持っていますが、JQuery と Javascript は私にとって比較的新しい言語であるため、必要なものの基本的な内訳を教えていただければ幸いです。

4

2 に答える 2

1

これを試して見てください

$("#placeslistcontainer ul").listview();

listview("refresh");既存のリストビューを更新するとうまくいくようです。

于 2013-03-13T05:40:08.753 に答える