javascript超時超時

Question

我使用jquery開發移動應用程序，這裏是我的代碼下面的問題，當我添加5或6行到頁面包含一切順利。但如果我添加多行顯示錯誤消息：Javascript執行exeeded超時。

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'); 

} 

Answer 1

很難知道，結果有多大？ 但是你應該開始你的緩存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'); 

} 

Answer 2

@soderslatt正在朝着正確的方向領導。請參閱http://www.learningjquery.com/2009/03/43439-reasons-to-use-append-correctly瞭解如何附加到未附加到DOM的元素（並避免重新刷新&迴流），然後將其附加到DOM並僅支付處罰一次

Answer 3

以下解決方案將解決您的問題。訣竅是在執行代碼之前使用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(); 
}