表與Twitter的引導和jQuery

我有這樣的JS腳本的一部分：表與Twitter的引導和jQuery

jQuery.each(data, function(index, value) { 
    $("table_div").append("<td>" + value + "</td>"); 
});

我想用這個創建表與Twitter的引導。在html頁面中有這個表格元素：

<table class="table table-striped" id="table_div"> 
</table>

但是這個解決方案不起作用。我該怎麼辦？謝謝！

來源

2012-09-22 sharkbait

什麼「不起作用」？ – moonwave99

我沒有twitter bootstrap風格的表 – sharkbait

'data'的結構是什麼？它是一個簡單的數組還是一個json對象？ – Bogdan

首先，你不追加中所需要使用表中的任何<tr>元素，其次你指的是$("table_div")而不是$("#table_div")（包括hashtag #意味着你指的是一個ID，就像在CSS中）。

jQuery.each(data, function(index, value) { 
    $("#table_div").append("<tr><td>" + value + "</td></tr>"); 
});

來源

2012-09-22 16:46:24 h2ooooooo

不起作用。我想要一個具有數據值的行和列的

元素。 – sharkbait

@sharkbait你的數據是什麼樣的？ – h2ooooooo

除了參照節點<table_div>，而不是ID #table_div你不希望任何附加的表節點。

你應該看看this以及here和here。

使用時Twitter的引導反正例如，像這樣你應該使用tbody：

<table id="table_div" class="table table-striped"> 
    <tbody></tbody> 
<table>

這裏的權利JS

for (i in data) { 
    $('#table_div > tbody:last').append('<tr><td>'+data[i]+'</td></tr>'); 
}

進行更多的研究看看這裏Add table row in jQuery

編輯：

好吧，我給你寫了一個使用twitters bootstrap和jQuery的例子。這個工作，如果它不適合你的數據數組，它有什麼問題。

<!DOCTYPE html> 
<html> 
<head> 
<link rel="stylesheet" type="text/css" href="assets/css/bootstrap.css"> 
</head> 
<body> 
<table class="table table-striped" id="my-table"> 
<tbody> 
</tbody> 
</table> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
<script type="text/javascript" src="assets/js/bootstrap.js"></script> 
<script type="text/javascript"> 
var data = ["foo","bar"]; 
$(document).ready(function(){ 
     $.each(data, function(i,item){ 
       $('#my-table > tbody:last').append('<tr><td>'+item+'</td></tr>'); 
     }); 
}); 
</script> 
</body> 
</html>

來源

2012-09-22 17:16:44 codingjoe

我不知道它爲什麼沒有作用......我認爲它是正確的，但它不起作用... – sharkbait

哈，真的，它不能。 '$。每個（回調）'。每個選項都沒有兩個選項。您需要在JavaScript中使用常規的foreach，而不是從jQuery中使用$ .each（）。它用於迭代所有子節點。 – codingjoe

如果仍然無效，請提供關於'data'的更多詳細信息。如果工作，請不要忘記標記這是一個答案，花了我一段時間;） – codingjoe

表與Twitter的引導和jQuery

回答

相關問題