Bootstrap示例：將數據從JSON加載到表中
[英]Bootstrap Example: Loading data from JSON into a table
問題描述
我試圖在這里遵循這個Bootstrap教程，到目前為止，下面的代碼如下。 此代碼似乎加載HTML頁面確定但它不會加載.json文件中的數據，即使.json文件位於同一目錄中。 我將這些文件放在我的網絡服務器上並通過Chrome查看頁面，但仍然使用空表。 控制台不顯示任何內容。 如何才能將data1.json數據顯示在表格中，我怎么能解決這個問題呢？
謝謝
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap 101 Template</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<h1>Hello, world!</h1>
<table data-toggle="table" data-url="data1.json" data-cache="false" data-height="299">
<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>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>
2 個解決方案
解決方案1
7 2014-09-19 03:14:54
Bootstrap不支持您要使用的表格功能。 你必須包括Bootstrap表。 否則它將無法工作。 下載Bootstrap表並在您的代碼中使用它。 http://bootstrap-table.wenzhixin.net.cn/getting-started
解決方案2
2 2016-06-30 12:47:46
遲到的答案，但以防萬一有人處理這個問題。 使用類似Ajax的請求的一個問題是您需要一台服務器。 實際上任何服務器都可以做到，但你不能讓它在普通的文件系統上工作。
無法使用 js function 將數據從 JSON 文件加載到 HTML 表中
[英]Trouble loading data from JSON file into HTML table with js function
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.