jquery DataTable插件如何实现表头固定,内容可滚动
时间: 2024-05-06 08:16:05 浏览: 133
可以使用jQuery DataTables插件中的fixedHeader选项来实现表头固定,内容可滚动的效果。
首先需要引入jQuery和DataTables插件的js和css文件,然后在初始化DataTables时,设置fixedHeader选项为true即可。示例代码如下:
```javascript
$(document).ready(function() {
$('#example').DataTable( {
fixedHeader: true
} );
} );
```
此时表头会固定在页面顶部,而表格内容可以滚动。如果需要设置表格高度,可以通过CSS样式来设置:
```css
.dataTables_scrollBody {
height: 200px;
overflow-y: auto;
}
```
其中,height属性设置表格高度,overflow-y属性设置垂直滚动条。
阅读全文