jQuery動態地向表中添加行數？

我有這樣jQuery動態地向表中添加行數？

<table id="user-data"> 
    <tr> 
     <th>Name</th> 
     <th>Email</th> 
     <th>Contact Number</th> 
    </tr> 
</table>

表現在，所有像姓名，電子郵件和聯繫號碼字段的字段從數據庫填充。在此之前，我只獲得一行內容。所以我做了這樣的腳本

<script type="text/javascript"> 
    var html = $('<tr><td><input type=\"text\" name=\"name\"></td><td><input type=\"text\" name=\"email\"></td><td><input type=\"text\" name=\"contact-number\"></td></tr>'); 
    $('table#user-data').append(html); 
</script>

這是在表中添加單行沒有任何問題。但是現在我想一次添加更多單行，行號每次都會改變。那麼有人能告訴我如何動態添加給定數量的行到表中嗎？任何幫助和建議將會非常令人滿意。謝謝

更新我得到了我的jQuery中的行數。可以說它在一個名爲Length的變量中。

來源

2014-09-06 NewUser

*「從數據庫填充」 *是沒有幫助的所有內部不同的報價，只要逃脫引號。數據的結構是什麼？一個數組，json，json數組.. ..？你應該相應地迭代。 – 2014-09-06 16:13:02

在上面的例子中，你的'var html'似乎是獨立於任何數據構建的（你提到的數據是從數據庫中填充的）。無論如何，你如何包裝填充行並遍歷從數據庫接收的集合的代碼？在這裏抓着吸管，jsfiddle會有幫助。 – r0hitsharma 2014-09-06 16:14:35

我在jQuery中獲得編號 – NewUser 2014-09-06 16:14:41

您可以將當前代碼包裝在for循環中，該代碼將爲您迭代的每條記錄添加一個新行。

for(i=0; i<data.length; i++){ 
    var html = $('<tr><td><input type=\"text\" name=\"name\"></td><td><input type=\"text\" name=\"email\"></td><td><input type=\"text\" name=\"contact-number\"></td></tr>'); 
    $('table#user-data').append(html); 
}

然後可以使用i+1作爲行號

來源

2014-09-06 16:15:29

如果你可以發佈你的數據源，我會修改我的答案，以便它適合你的情況......它現在真的只是一個刺在 – 2014-09-06 16:16:07

評論選項是有一個原因。你似乎有足夠的代表評論，要求更多的信息。在黑暗中刺傷是一種不好的做法，因爲用戶會在沒有足夠信息的情況下繼續回答這些黑暗的問題。 – 2014-09-06 16:17:34

我很欣賞你的意見，但這是他的問題的合理答案...這就是爲什麼我選擇不把它放在問題評論中。 – 2014-09-06 16:18:54

至於你提到的價值，假設你有記錄在一個名爲length變量的數量。

您可以添加行的數量很多，如下所示：

var html; 
for(i=0; i<length; i++){ 
    html += '<tr><td><input type="text" name="name"></td><td><input type="text" name="email"></td><td><input type="text" name="contact-number"></td></tr>'; 
} 
$('table#user-data').append(html);

旁註：

這是一個很好的做法，以避免DOM操作如果可能的內部循環。在這種情況下，您可以將連接到HTML並一次追加全部。
您不必爲您所使用的字符串

來源

2014-09-06 16:29:14

jQuery動態地向表中添加行數？

回答

相關問題