null
var $table = $('#table');
var mydata =
[
{
"id": 0,
"name": "test0",
"price": "$0"
},
{
"id": 1,
"name": "test1",
"price": "$1"
},
{
"id": 2,
"name": "test2",
"price": "$2"
},
{
"id": 3,
"name": "test3",
"price": "$3"
},
{
"id": 4,
"name": "test4",
"price": "$4"
},
{
"id": 5,
"name": "test5",
"price": "$5"
},
{
"id": 6,
"name": "test6",
"price": "$6"
},
{
"id": 7,
"name": "test7",
"price": "$7"
},
{
"id": 8,
"name": "test8",
"price": "$8"
},
{
"id": 9,
"name": "test9",
"price": "$9"
},
{
"id": 10,
"name": "test10",
"price": "$10"
},
{
"id": 11,
"name": "test11",
"price": "$11"
},
{
"id": 12,
"name": "test12",
"price": "$12"
},
{
"id": 13,
"name": "test13",
"price": "$13"
},
{
"id": 14,
"name": "test14",
"price": "$14"
},
{
"id": 15,
"name": "test15",
"price": "$15"
},
{
"id": 16,
"name": "test16",
"price": "$16"
},
{
"id": 17,
"name": "test17",
"price": "$17"
},
{
"id": 18,
"name": "test18",
"price": "$18"
},
{
"id": 19,
"name": "test19",
"price": "$19"
},
{
"id": 20,
"name": "test20",
"price": "$20"
}
];
$(function () {
$('#table').bootstrapTable({
data: mydata
});
//console.log(mydata);
});<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"/>
<link rel="stylesheet" href="https://rawgit.com/wenzhixin/bootstrap-table/master/dist/bootstrap-table.min.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://rawgit.com/wenzhixin/bootstrap-table/master/dist/bootstrap-table.min.js"></script>
<div class="container">
<table id="table">
<thead>
<tr>
<th data-field="id">Item ID</th>
<th data-field="name">Item Name</th>
<th data-field="price">Item Price</th>
</tr>
</thead>
</table>
</div>null
我强烈建议您使用jQuery DataTable。
一个将任何数组或JSON数据转换为HTML表的简单插件
只需像这样调用datatable init
$(function () {
$('#table').DataTable({
ajax: {
url: "../call/Mydata.php", // will return the JSON as response
type: 'GET'
},
columns: [
{ data: "users.id" },
{ data: "users.name" },
{ data: "users.price" },
]
})
};
你有什么问题？您的代码运行得很好。以下是一个小提琴链接:
HTML:
<div class="container">
<table id="table">
<thead>
<tr>
<th data-field="id">Item ID</th>
<th data-field="name">Item Name</th>
<th data-field="price">Item Price</th>
</tr>
</thead>
</table>
</div>
工作小提琴
