首頁猿問數據表不顯示數據

數據表不顯示數據

JavaScript

夢里花落0921 2023-05-25 17:19:58

我已經像網站提供的那樣包含了 CDN，即使復制粘貼了每一行代碼，仍然無法顯示或顯示任何結果。這是CDN<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.22/css/jquery.dataTables.css"><script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.js"></script>這是我的代碼<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.22/css/jquery.dataTables.css"><script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.js"></script><body><table id="example" class="display"> <thead> <tr> <th>Name</th> <th>Position</th> <th>Salary</th> </tr> </thead></table></body>這是腳本[ { "name": "Tiger Nixon", "position": "System Architect", "salary": "$3,120" }, { "name": "Garrett Winters", "position": "Director", "salary": "$5,300" }]$('#example').DataTable( { data: data, columns: [ { data: 'name' }, { data: 'position' }, { data: 'salary' } ]} );

查看完整描述

2 回答

富國滬深

TA貢獻1790條經驗獲得超9個贊

你錯過了兩件事：

JQuery 庫
變量data_

請檢查以下解決方案。

var data = [{

"name": "Tiger Nixon",

"position": "System Architect",

"salary": "$3,120"

{

"name": "Garrett Winters",

"position": "Director",

"salary": "$5,300"

}

]

$('#example').DataTable({

data: data,

columns: [{

data: 'name'

{

data: 'position'

{

data: 'salary'

}

]

});

<html>

<body>

<thead>

<tr>

<th>Position</th>

<th>Salary</th>

</tr>

</thead>

</table>

</body>

</html>

反對回復 2023-05-25

哈士奇WWW

TA貢獻1799條經驗獲得超6個贊

jquery datatables.js 需要jquery。你應該在 jquery.datatables.js 之前添加它。

And you even don't need to define columns in your datatable, datatables does the work itself :

<body>

</body>

var dataSet = [

[ "Tiger Nixon", "System Architect", "Edinburgh", "5421", "2011/04/25", "$320,800" ],

[ "Garrett Winters", "Accountant", "Tokyo", "8422", "2011/07/25", "$170,750" ],

];

$(document).ready(function() {

$('#example').DataTable( {

data: dataSet,

columns: [

{ title: "Name" },

{ title: "Position" },

{ title: "Office" },

{ title: "Extn." },

{ title: "Start date" },

{ title: "Salary" }

]

} );

</script>

反對回復 2023-05-25

2 回答
0 關注
150 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

數據表不顯示數據

數據表不顯示數據

2 回答

添加回答