2

私はjqueryを使用してモバイルアプリケーションを開発しています。これは、含まれているページに5行または6行を追加するとすべてがうまくいくという問題の下のコードです。しかし、複数の行を追加すると、エラーメッセージが表示されます: Javascript の実行がタイムアウトになりました。

function succes_recu_list_rubrique(tx, results)   //apés avoire remplir sqlite
{
    console.log('ENTRééééééééééééééé---')

    $('#lbtn').prepend("<legend>Selectionner un Rubrique</legend><br>");
    for( var i=0; i<results.rows.length; i++  )            //Remplir tableau liste des identifiants étapes
    { 
    $('#lbtn').append("<input name='opt1' checked type='radio' value="+results.rows.item(i).IdRubrique+"    id="+results.rows.item(i).IdRubrique+" />");
    $('#lbtn').append('<label for='+results.rows.item(i).IdRubrique+'>'+results.rows.item(i).LibelleRubrique+'</label>');   
    }
    $('#lbtn').append('<a href="#page_dialog2"     class="offer2"      data-rel="dialog"    data-role="button" >Consulter</a>').trigger('create');
    $('#lbtn').append('<a href="#'+id_grp_rub+'"   data-role="button"             data-rel="back" data-theme="c" >Cancel</a> ').trigger('create');

}
4

3 に答える 3

0

わかりにくいですが、results.rowの大きさはどれくらいですか？ただし、jQueryオブジェクトのキャッシュを開始し、DOM挿入を最小限に抑えるようにしてください。

以下はテストされていませんが、正しい方向を示します。

function succes_recu_list_rubrique(tx, results)   //apés avoire remplir sqlite
{
    console.log('ENTRééééééééééééééé---')

    var htmlToAppend = "";
    var $lbtn = $('#lbtn');

    htmlToAppend += "<legend>Selectionner un Rubrique</legend><br>";

    for( var i=0; i<results.rows.length; i++  )            //Remplir tableau liste des identifiants étapes
    { 
        htmlToAppend += "<input name='opt1' checked type='radio' value="+results.rows.item(i).IdRubrique+" id="+results.rows.item(i).IdRubrique+" />";
        htmlToAppend += "<label for='+results.rows.item(i).IdRubrique+'>'+results.rows.item(i).LibelleRubrique+'</label>";
    }
    $lbtn.append(htmlToAppend);

    $lbtn.append('<a href="#page_dialog2"     class="offer2"      data-rel="dialog"    data-role="button" >Consulter</a>').trigger('create');
    $lbtn.append('<a href="#'+id_grp_rub+'"   data-role="button"             data-rel="back" data-theme="c" >Cancel</a> ').trigger('create');

}
于 2012-12-01T11:02:38.723 に答える
0

以下の解決策はあなたの問題を解決します。秘訣は、コードを実行する前に待機する 1 ミリ秒という非常に短い数値で setTimeout 関数を使用することです。上記の方法を使用すると、スレッドのロックを解除し、タイムアウトの超過エラーを回避できます。

サンプル例:

function succes_recu_list_rubrique(tx, results) {

    var i = 0;

    function appendOperation() {
        $('#lbtn').append(
            [
                "<input name='opt1' checked type='radio' value=", results.rows.item(i).IdRubrique, " id=", results.rows.item(i).IdRubrique, " />",
                "<label for=", results.rows.item(i).IdRubrique, ">", results.rows.item(i).LibelleRubrique, "</label>"
            ].join("")
        );

        if (i++ < results.rows.length) {
            setTimeout(appendOperation, 1);
        } 
    }
    appendOperation();
}
于 2013-02-18T21:54:07.023 に答える
0

@soderslatt は正しい方向に向かっています。DOM にアタッチされていない要素に追加する方法 (および再描画とリフローを回避する方法) については、http://www.learningjquery.com/2009/03/43439-reasons-to-use-append-correctlyを参照してください。 DOM に送信し、ペナルティを 1 回だけ支払う

于 2012-12-11T20:53:43.710 に答える