Javascript Bootstrap 示例：将数据从 JSON 加载到表中
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25925604/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap Example: Loading data from JSON into a table
提问by AAA
I am trying to follow this Bootstrap tutorial hereand so far have the following code below. This code seems to load the HTML page OK but it does not load the data in the .json file even though the .json file is in the same directory. I am placing these files on my web server and viewing the page through Chrome but still with an empty table. The console doesn't display anything. How can I get the data1.json data to display in the table and how could I have troublshooted this?
我正在尝试按照此处的Bootstrap 教程进行操作，到目前为止，下面的代码如下。此代码似乎可以正常加载 HTML 页面，但即使 .json 文件位于同一目录中，它也不会加载 .json 文件中的数据。我将这些文件放在我的网络服务器上并通过 Chrome 查看页面，但仍然有一个空表。控制台不显示任何内容。我怎样才能让 data1.json 数据显示在表中，我怎么能解决这个问题？
Thank you
谢谢
<!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>
回答by handk
Bootstrap does not support the table feature you want to use. You have to include Bootstrap Table. Otherwise it won't work. Download Bootstrap table and use it in your code. http://bootstrap-table.wenzhixin.net.cn/getting-started
Bootstrap 不支持您要使用的表格功能。您必须包括 Bootstrap 表。否则它不会工作。下载 Bootstrap 表并在您的代码中使用它。 http://bootstrap-table.wenzhixin.net.cn/getting-started
回答by user2653774
Late answer but just in case somebody is with this issue. One of the problems of using ajax-like requests is that you need a server. Virtually any server could do, but you cannot get it working on plain filesystem.
迟到的答案，但以防万一有人遇到这个问题。使用类似ajax 的请求的问题之一是您需要一个服务器。几乎任何服务器都可以做，但你不能让它在普通文件系统上工作。
