bootstrapTable实现多层表头

1、html

2、js

columns: [
						[{
							title: '这是标题',
							field: '',
							align: 'center',
							valign: 'middle',
							colspan: 10
						}],
						[{
							title: '这是标题1',
							field: '',
							align: 'center',
							valign: 'middle',
							colspan: 1,
							rowspan: 2
						}, {
							title: '这是标题2',
							field: '',
							align: 'center',
							valign: 'middle',
							colspan: 4,
							rowsapn: 1
						}, {
							title: '这是标题3',
							field: '',
							align: 'center',
							valign: 'middle',
							colspan: 5,
							rowsapn: 1
						}],
						[{
								field: 'title1', //列ID同时也是指定要显示的数据的ID   
								title: '标题',
								width: 100,
								align: 'center',
								valign: 'middle',
								sortable: true
							}, {
								field: 'title2', //列ID同时也是指定要显示的数据的ID   
								title: '标题',
								width: 100,
								align: 'center',
								valign: 'middle',
								sortable: true
							}, {
								field: 'title3', //列ID同时也是指定要显示的数据的ID   
								title: '标题',
								width: 100,
								align: 'center',
								valign: 'middle',
								sortable: true
							}, {
								field: 'title4', //列ID同时也是指定要显示的数据的ID   
								title: '标题',
								width: 100,
								align: 'center',
								valign: 'middle',
								sortable: true

							}, {
								field: 'title5', //列ID同时也是指定要显示的数据的ID   
								title: '标题',
								width: 100,
								align: 'right',
								valign: 'middle',
								sortable: true
							}, {
								field: 'title6', //列ID同时也是指定要显示的数据的ID   
								title: '标题',
								width: 100,
								align: 'center',
								valign: 'middle',
								sortable: true
							},
							{
								field: 'title7', //列ID同时也是指定要显示的数据的ID   
								title: '标题',
								width: 100,
								align: 'center',
								valign: 'middle',
								sortable: true
							},
							{
								field: 'title8', //列ID同时也是指定要显示的数据的ID   
								title: '标题',
								width: 100,
								align: 'center',
								valign: 'middle',
								sortable: true
							},

							{
								field: 'title9', //列ID同时也是指定要显示的数据的ID   
								title: '标题',
								width: 100,
								align: 'center',
								valign: 'middle',
								sortable: true
							}
						]
					]
				

显示结果如下:


你可能感兴趣的:(bootstrap)