Javascript 让最基本的Backgrid.js示例正常工作
我正在尝试让backgrid.js的最基本示例正常工作。换句话说，在这个示例中，我可以将源文件夹放到我的xampp/htdocs文件夹中并运行，而无需执行任何其他操作 我已经尝试了很多方法让代码运行，但我无法得到任何显示。 下面是我制作的html页面，试图看到一个示例工作Javascript 让最基本的Backgrid.js示例正常工作,javascript,jquery,backgrid,Javascript,Jquery,Backgrid,我正在尝试让backgrid.js的最基本示例正常工作。换句话说，在这个示例中，我可以将源文件夹放到我的xampp/htdocs文件夹中并运行，而无需执行任何其他操作 我已经尝试了很多方法让代码运行，但我无法得到任何显示。 下面是我制作的html页面，试图看到一个示例工作 <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="bootstrap/css/bootstrap.css"
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="bootstrap/css/bootstrap.css"/>
<link rel="stylesheet" href="lib/backgrid.css"/>
<script src="jquery-1.10.2.min.js"></script>
<script src="underscore-min.js"></script>
<script src="backbone-min.js"></script>
<script src="lib/backgrid.js"></script>
</head>
<body>
<div id="grid">
<script type="text/javascript">
var Territory = Backbone.Model.extend({});
var Territories = Backbone.Collection.extend({
model: Territory,
url: "territories.json"
});
var territories = new Territories();
var columns = [{
name: "id", // The key of the model attribute
label: "ID", // The name to display in the header
editable: false, // By default every cell in a column is editable, but *ID* shouldn't be
// Defines a cell type, and ID is displayed as an integer without the ',' separating 1000s.
cell: Backgrid.IntegerCell.extend({
orderSeparator: ''
})
}, {
name: "name",
label: "Name",
// The cell type can be a reference of a Backgrid.Cell subclass, any Backgrid.Cell subclass instances like *id* above, or a string
cell: "string" // This is converted to "StringCell" and a corresponding class in the Backgrid package namespace is looked up
}, {
name: "pop",
label: "Population",
cell: "integer" // An integer cell is a number cell that displays humanized integers
}, {
name: "percentage",
label: "% of World Population",
cell: "number" // A cell type for floating point value, defaults to have a precision 2 decimal numbers
}, {
name: "date",
label: "Date",
cell: "date"
}, {
name: "url",
label: "URL",
cell: "uri" // Renders the value in an HTML anchor element
}];
// Initialize a new Grid instance
var grid = new Backgrid.Grid({
columns: columns,
collection: territories
});
// Render the grid and attach the root to your HTML document
$("#example-1-result").append(grid.render().el);
// Fetch some countries from the url
territories.fetch({reset: true});
</script>
</div>
</body>
</html>
var Territory=Backbone.Model.extend（{}）；
var territions=Backbone.Collection.extend({
型号：Territory，
url:“territions.json”
});
var Territions=新界（）；
变量列=[{
名称：“id”，//模型属性的键
标签：“ID”，//要在标题中显示的名称
可编辑：false，//默认情况下，列中的每个单元格都是可编辑的，但是*ID*不应该是可编辑的
//定义单元格类型，ID显示为整数，不带“，”分隔1000。
单元格：Backgrid.IntegerCell.extend({
订单分隔符：“”
})
}, {
姓名：“姓名”，
标签：“姓名”，
//单元格类型可以是Backgrid.cell子类、任何Backgrid.cell子类实例（如上面的*id*）或字符串的引用
cell:“string”//将其转换为“StringCell”，并在Backgrid包命名空间中查找相应的类
}, {
姓名：“流行”，
标签：“人口”，
单元格：“整数”//整数单元格是显示人性化整数的数字单元格
}, {
名称：“百分比”，
标签：“%的世界人口”，
单元格：“数字”//浮点值的单元格类型，默认为精度为2个十进制数字
}, {
姓名：“日期”，
标签：“日期”，
单元格：“日期”
}, {
名称：“url”，
标签：“URL”，
单元格：“uri”//呈现HTML锚元素中的值
}];
//初始化一个新的网格实例
var grid=新的Backgrid.grid({
列：列，
收藏：领土
});
//呈现网格并将根附加到HTML文档
$（“#示例-1-result”）.append（grid.render（）.el）；
//从url获取一些国家/地区
territions.fetch（{reset:true}）；
谢谢你的时间 您似乎正在将网格添加到不存在的元素：
$("#example-1-result").append(grid.render().el);
$（“#网格”）