Javascript 使用recline.js和slickgrid的新手

Javascript 使用recline.js和slickgrid的新手,javascript,slickgrid,Javascript,Slickgrid,我正在尝试使用recline.js上的《快速入门指南》,网格中出现了我为尝试使用快速入门示例而创建的html。我已经验证了所有的.js路径都是正确的 我想不出我到底做错了什么。请让我知道我做错了什么 <!DOCTYPE html> <script type="text/javascript" src="vendor/jquery/1.7.1/jquery.js"></script> <script type="text/javascript" src="

我正在尝试使用recline.js上的《快速入门指南》,网格中出现了我为尝试使用快速入门示例而创建的html。我已经验证了所有的.js路径都是正确的

我想不出我到底做错了什么。请让我知道我做错了什么

<!DOCTYPE html>
<script type="text/javascript" src="vendor/jquery/1.7.1/jquery.js"></script>
<script type="text/javascript" src="vendor/underscore/1.1.6/underscore.js"></script>
<script type="text/javascript" src="vendor/backbone/0.5.1/backbone.js"></script>
<script type="text/javascript" src="vendor/mustache/0.5.0-dev/mustache.js"></script>
<script type="text/javascript" src="vendor/slickgrid/2.0.1/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="vendor/slickgrid/2.0.1/jquery.event.drag- 2.0.min.js"></script>
<script type="text/javascript" src="vendor/slickgrid/2.0.1/slick.grid.min.js"></script>
<script type="text/javascript" src="dist/recline.js"></script>

<script type="text/javascript" >
$(function() {
  var data = [
    {id: 0, date: '2011-01-01', x: 1, y: 2, z: 3, country: 'DE', geo: {lat:52.56, lon:13.40} },
    {id: 1, date: '2011-02-02', x: 2, y: 4, z: 24, country: 'UK', geo: {lat:54.97, lon:-1.60}},
    {id: 2, date: '2011-03-03', x: 3, y: 6, z: 9, country: 'US', geo: {lat:40.00, lon:-75.5}},
    {id: 3, date: '2011-04-04', x: 4, y: 8, z: 6, country: 'UK', geo: {lat:57.27, lon:-6.20}},
    {id: 4, date: '2011-05-04', x: 5, y: 10, z: 15, country: 'UK', geo: {lat:51.58, lon:0}},
    {id: 5, date: '2011-06-02', x: 6, y: 12, z: 18, country: 'DE', geo: {lat:51.04, lon:7.9}}
  ];

  var dataset = new recline.Model.Dataset({
    records: data
  });

  var $el = $('#myGrid');
  var grid = new recline.View.SlickGrid ({
    model: dataset,
    el : $el
  });

  grid.visible = true;
  grid.render();
});
</script>
<html>
  <head>
    <!-- CSS for relevant view components - here we just have grid -->
    <link rel="stylesheet" href="vendor/bootstrap/2.0.2/css/bootstrap.css" />
    <link rel="stylesheet" href="css/slickgrid.css" />
  </head>
  <body>
    <div id="myGrid" style="width:600px;height:500px;"></div>
  </body>
</html>

$(函数(){
风险值数据=[
{id:0,日期:'2011-01-01',x:1,y:2,z:3,国家:'DE',地理:{lat:52.56,lon:13.40},
{id:1,日期:'2011-02-02',x:2,y:4,z:24,国家:'UK',地理:{lat:54.97,lon:-1.60},
{id:2,日期:'2011-03-03',x:3,y:6,z:9,国家:'US',地理:{lat:40.00,lon:-75.5},
{id:3,日期:'2011-04-04',x:4,y:8,z:6,国家:'UK',地理:{lat:57.27,lon:-6.20},
{id:4,日期:'2011-05-04',x:5,y:10,z:15,国家:'UK',地理:{lat:51.58,lon:0},
{id:5,日期:'2011-06-02',x:6,y:12,z:18,国家:'DE',地理:{lat:51.04,lon:7.9}}
];
var数据集=新的倾角.Model.dataset({
记录:数据
});
var$el=$(“#myGrid”);
var grid=新的倾角.View.SlickGrid({
模型:数据集,
el:$el
});
grid.visible=true;
grid.render();
});

需要包含的CSS文件是:

vendor/slickgrid/2.0.1/slick.grid.css

我想你必须在标记之前写css标记谢谢你的建议,我试过了,但它仍然在做同样的事情。解决了这个问题,需要包含一些比教程中列出的更多的.css。把你的脚本标记放在
中,绝对不要放在
之前。