1

这是我用于动态创建 div 并从 Phonegap 数据库填充它的代码但是(a)它不会从数据库中添加动态部分。(b) Rows: 转储 html 内容后,在调试器控制台中打印条目。IE。似乎缺乏同步:

var newPage;
var qry="SELECT literal,kunyomi from kanji where Unicode in(select b.Unicode from kanji_reading b where substr(b.kunyomi,1,1)='"+yomi+"')";

db.transaction(function (tx)
        {
            newPage = "<div data-role=page data-url=hi><div data-role=header><h1>" + yomi+ "</h1></div><div data-role=content>";
            newPage +="<ul data-role='listview' id='details'>";

            var temp="";    
            tx.executeSql(qry, [], function(tx,res)
                    {
                        var i;
                        var len = res.rows.length;
                        console.log("records"+len); 
                        for (i=0; i<len; i++)
                            {
                                newPage+="<li><span class='tra-info-text'>"+res.rows.item(i).kunyomi+"</span></li>";
                            }
                        newPage+="</ul></div></div>";
                    },null);

            var page=$(newPage);
            console.log("page:"+page);
            console.log("New Page:"+newPage);
            console.log("page container:"+$.mobile.pageContainer);
            page.appendTo($.mobile.pageContainer);
            $.mobile.changePage( page );    

    });

输出console.log("New Page:"+newPage);仅显示静态部分,即在 tx.executeSQL 部分之前。不会显示在 tx.executeSQL 中添加的任何内容。

任何人都可以帮忙吗?

4

1 回答 1

0

SQL 查询是异步的,这意味着您的代码结尾(以 开头var page = $(newPage))很可能会在您的事务完成之前执行。您应该确保其余代码在事务之后执行,最简单的方法是将其放在 SQL 事务的回调中。

db.transaction(function (tx)
    {
        newPage = "<div data-role=page data-url=hi><div data-role=header><h1>" + yomi+ "</h1></div><div data-role=content>";
        newPage +="<ul data-role='listview' id='details'>";

        var temp="";    
        tx.executeSql(qry, [], function(tx,res)
                {
                    var i;
                    var len = res.rows.length;
                    console.log("records"+len); 
                    for (i=0; i<len; i++)
                        {
                            newPage+="<li><span class='tra-info-text'>"+res.rows.item(i).kunyomi+"</span></li>";
                        }
                    newPage+="</ul></div></div>";
                    var page=$(newPage);
                    console.log("page:"+page);
                    console.log("New Page:"+newPage);
                    console.log("page container:"+$.mobile.pageContainer);
                    page.appendTo($.mobile.pageContainer);
                    $.mobile.changePage( page );   
                },null);



});
于 2013-01-15T08:23:04.027 回答