JQuery「append」掛起頁面

$.each(Data, function (i, item) { 
      //debugger; 
      var newrow = $(".hide").clone(); 
      $(newrow).find(".hdnID").val(item.ID); 
      $(newrow).find(".hdnSecID").val(item.SecID); 
      $(newrow).find(".hdnSno").val(item.SNO); 
      $(newrow).find(".hdnMchID").val(item.MchId); 
      $(newrow).find(".MchDesc").html(item.MchDesc); 
      $(newrow).find(".jobdesc").html(item.JobDesc); 
      $(newrow).find(".SecName").html(item.SecName); 
      Index++; 
      console.log(Index); 


      $("#Acdetail").append($(newrow)); 


     });

有250項需要追加。但它掛起了頁面。如果我刪除$("#Acdetail").append($(newrow));並只使用console.log打印新行的html，它將在2秒內打印出來。JQuery「append」掛起頁面

任何幫助？

來源

2016-12-15 Nadeem Aamir

250是不是一個非常高的數字，使掛起發生。你在頁面上有多少'$（'。hide'）'元素？ – asprin

你確定它是$（「#Acdetail」）。append（$（newrow））;而不是$（「#Acdetail」）。append（newrow）你必須做的？ – agfc

@asprin只有一個 –

你再克隆每次each回調被調用（通過搜索每次都匹配.hide元素）時間先前附加元素。所以在第一遍中，也許你只有一個，所以你追加了一個;在下一個過程中，你有兩個，所以你附加兩個;在第三關你有四所以你追加了四個;第四關，你有八個所以你追加八。等等。假設你從一個開始，你將以250結束！（250 factorial）元素，這是一個極高 number：3.23285626E + 492

你可能不想這樣做。

可能最好做一個初始克隆，然後reclone它，而不是重新搜索所有.hide元素的DOM。

此外，你有一個很多在那裏不必要的電話$()。

這解決了兩個問題：

var clone = $(".hide").clone(); 
$.each(Data, function(i, item) { 
    //debugger; 
    var newrow = clone.clone(); 
    newrow.find(".hdnID").val(item.ID); 
    newrow.find(".hdnSecID").val(item.SecID); 
    newrow.find(".hdnSno").val(item.SNO); 
    newrow.find(".hdnMchID").val(item.MchId); 
    newrow.find(".MchDesc").html(item.MchDesc); 
    newrow.find(".jobdesc").html(item.JobDesc); 
    newrow.find(".SecName").html(item.SecName); 
    Index++; 
    console.log(Index); 
    $("#Acdetail").append(newrow); 
});

而事實上，好做追加等到最後，當你完成：

var clone = $(".hide").clone(); 
var toAppend = $(); 
$.each(Data, function(i, item) { 
    //debugger; 
    var newrow = clone.clone(); 
    newrow.find(".hdnID").val(item.ID); 
    newrow.find(".hdnSecID").val(item.SecID); 
    newrow.find(".hdnSno").val(item.SNO); 
    newrow.find(".hdnMchID").val(item.MchId); 
    newrow.find(".MchDesc").html(item.MchDesc); 
    newrow.find(".jobdesc").html(item.JobDesc); 
    newrow.find(".SecName").html(item.SecName); 
    Index++; 
    console.log(Index); 
    toAppend = toAppend.add(newrow); 
}); 
toAppend.appendTo("#Acdetail");

如果你曾經打算第二次運行此代碼，您需要執行一些操作來過濾掉之前的.hide元素（可能會刪除該類）。後$（NEWROW）

來源

2016-12-15 12:16:44

好的。我沒有看到那裏的問題。 +1 – asprin

  $.each(Data, function (i, item) { 

      var newrow = $(".hide").clone(); 
      $(newrow).find(".hdnID").val(item.ID); 
      $(newrow).find(".hdnSecID").val(item.SecID); 
      $(newrow).find(".hdnSno").val(item.SNO); 
      $(newrow).find(".hdnMchID").val(item.MchId); 
      $(newrow).find(".MchDesc").html(item.MchDesc); 
      $(newrow).find(".jobdesc").html(item.JobDesc); 
      $(newrow).find(".SecName").html(item.SecName); 
      Index++; 

      $(newrow).removeClass("hide").addClass('sectr'); 
      $("#Acdetail").append(newrow); 

     });

問題已解決.removeClass（「隱藏」）addClass（ 'sectr'）。實際上問題是（.hide）的克隆太多了。

來源

2016-12-15 12:25:01

JQuery「append」掛起頁面

回答

相關問題