JQuery/bootstrap加載並附加表格

得到了一個巨大的多部分表格，因此決定創建一個tbody併爲其添加部分。我嘗試的下列代碼和變體沒有按照我的預期行事。每個section.html是一個例如JQuery/bootstrap加載並附加表格

<tr data-toggle="collapse" data-target="#demo1" class="accordion-toggle">

但是每增加一個部分都會取代以前的部分。我期待添加多個表格行 - 例如追加（） - 我使用它的方式 - 不工作..我如何能追加HTML「<tr>...</tr>」大塊的<tbody>

非常感謝

凱文

代碼（不是任何線索追加）：

<legend>New Landlord License</legend> 
<div class="control-group"> 
<div class="bs-example"> 
    <table class="table table-condensed" style="border-collapse:collapse;margin-bottom:0px;"> 
    <tbody id="tb" name="tb"> 
    </tbody> 
    </table> 
</div> 
</div> 
<script> 
    $(document).ready(function() { 
     $('#tb').load("./section1.html") 
     $('#tb').append().load("./section2.html"); 
    }); 
</script>

來源

2015-09-12 KevinY

你可以試試這個：

$(document).ready(function() { 
    $('#tb').load("./section1.html"); 
    $.get("./section2.html", function(data){ 
     $('#tb').append(data); 
    }); 
});

來源

2015-09-12 20:16:22 Beginner

想要首先感謝初學者讓我走上正軌。我必須通過在分區代碼中放置單獨的表格而不是表格行來創建我的原始版本的變體。我使用初學者的幫助解決這個問題，並把完成下面的部分。原因是因爲我偶然發現了一個時間問題，這可能導致各部分出現錯誤的順序。

<script> 
$(document).ready(function() { 
$.get("./section1.html",function(data){ 
    $('#tbls').append(data); 
    $.get("./section2.html",function(data){ 
     $('#tbls').append(data); 
     $.get("./section3.html",function(data){ 
     $('#tbls').append(data); 
     $.get("./section4.html",function(data){ 
      $('#tbls').append(data); 
      $.get("./section5.html",function(data){ 
       $('#tbls').append(data); 
      }); 
      }); 
     }); 
    }); 
    }); 
}); 
</script>

來源

2015-09-13 14:51:07 KevinY

我建議你只是遍歷數組contaand添加他們。

$(document).ready(function() { 
    var pages = [1, 5, 7, 12]; 
    for(var i = 0; i < pages.length;i++){ 
     $.ajax({ 
      async: false, 
      type: 'GET', 
      url: "./section" + i +".html", 
      success: function(data) { 
       $('#tbls').append(data); 
      } 
     }); 
    } 
});

來源

2015-09-13 14:58:07

謝謝，我試了幾次，但加載順序並不總是順序的（例如2,3,4,5,1 ... 1,2,3,4,5 ... 2,3 ，4,5,1 ..）。這顯然看起來很整潔，但它看起來像「ajax成功：」代碼在返回結果之前繼續執行，因此在完成前一個塊之前在某些情況下獲取下一部分。 – KevinY

@KevinY更新了我的答案。另外，因爲它使用'async：false'，所以會暫停瀏覽器加載，直到它完成，這意味着它們將按順序加載到'＃tbls'中。 –

JQuery/bootstrap加載並附加表格

回答

相關問題