Bootstrap示例：将数据从JSON加载到表中

问题描述：

我正在尝试遵循此Bootstrap教程here，并且到目前为止有以下代码。此代码似乎加载HTML页面正常，但它不会加载.json文件中的数据，即使.json文件位于同一目录中。我将这些文件放在我的网络服务器上，并通过Chrome浏览器查看页面，但仍然是空表格。控制台不显示任何东西。我怎样才能让data1.json数据在表格中显示，以及我怎样才能解决这个问题？Bootstrap示例：将数据从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>

答

引导不支持您要使用的表格功能。你必须包含Bootstrap Table。否则它将无法工作。下载Bootstrap表并在你的代码中使用它。 http://bootstrap-table.wenzhixin.net.cn/getting-started

谢谢 - 表正在页面上加载，但它仍然缺少数据。当我把data-url = data1.json或完整的https：// www。示例服务器上文件的路径我仍然在控制台中收到错误消息：XMLHttpRequest无法加载http://www.wenzhixin.net.cn/p/bootstrap-table/docs/data1.json?_=1411124131792。请求的资源上没有“Access-Control-Allow-Origin”标题。因此不允许原产地'null'访问。 – AAA 2014-09-19 10:58:06

它似乎在Web服务器端的跨域设置问题。当我在本地尝试教程代码（即不是在wrb servet）时，我可以看到包含数据的表格。 – handk 2014-09-20 02:43:49

那么你能解决这个问题吗？我也一直在收到这个错误。 – 2015-11-14 04:15:38

答

迟到的答案，但以防万一有人在这个问题。使用类似Ajax的请求的一个问题是您需要一台服务器。几乎所有的服务器都可以这样做，但是无法在纯文件系统上运行。

Bootstrap示例：将数据从JSON加载到表中

相关推荐