bootstrapTable表格完整的使用方法

BootstrapTable是一个Bootstrap基础框架的增强版，可以用来创建漂亮的、可扩展的表格。下面是BootstrapTable表格的完整使用方法：

1.引入Bootstrap和BootstrapTable的CSS和JS文件

<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap-table/1.11.1/bootstrap-table.min.css">
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap-table/1.11.1/bootstrap-table.min.js"></script>

2.创建一个表格

<table id="table"></table>

3.配置表格

$('#table').bootstrapTable({
    url: 'data.json', // 数据源
    columns: [{
        field: 'name', // 列名，对应数据源中的属性名
        title: '姓名' // 列的标题
    }, {
        field: 'age',
        title: '年龄'
    }, {
        field: 'gender',
        title: '性别'
    }]
});

4.添加数据

$('#table').bootstrapTable('load', data);

5.添加事件

$('#table').on('click-row.bs.table', function (e, row, $element) {
    // 当用户点击某行时触发
    console.log(row);
});

这是BootstrapTable表格的基本用法，你可以根据需要配置更多的选项和事件来满足你的需求。