Bootstrap table学习心得 问题解答

第一次使用Bootstrap-table这个表格插件，记录一下使用过程中遇到的问题。

|引入CSS文件

css">

|引入相关库

我们需要引入Jquery库、bootstrap库、以及bootstrap-table.js文件

|启用Bootstrap Table插件：

官方文档中给出了我们有两种那个方式来启用bootstrap-table插件：

1、通过data属性的方式：

Item ID

Item Name

Item Price

1

Item 1

$1

2

Item 2

$2

2、通过js的方式：

//只需要HTML中写下table标签，并设置id

$('#table').bootstrapTable({

columns: [{

field:'id',    

title:'Item ID'

}, {

field:'name',

title:'Item Name'

}, {

field:'price',

title:'Item Price'

}],

data: [{

id: 1,

name:'Item 1',

price:'$1'

}, {

id: 2,

name:'Item 2',

price:'$2'

}]

});

也可以通过url获取数据

$('#table').bootstrapTable({

url:'data1.json',

columns: [{

field:'id',    //与返回值的JSON数据的key值对应

title:'Item ID'  //列名

}, {

field:'name',

title:'Item Name'

}, {

field:'price',

title:'Item Price'

}, ]

});

以上就是本文的全部内容，希望对大家的学习有所帮助