如果您仅针对移动设备,那么这可能对您有用:您可以克隆表中的第一列并应用,
position:absolute以便在滚动表的其余部分时将其显示在“前面”。
为此,您需要一些基本的jquery代码和一个自定义CSS类:
jQuery
$(function(){ var $table = $('.table'); //Make a clone of our table var $fixedColumn = $table.clone().insertBefore($table).addClass('fixed-column'); //Remove everything except for first column $fixedColumn.find('th:not(:first-child),td:not(:first-child)').remove(); //Match the height of the rows to that of the original table's $fixedColumn.find('tr').each(function (i, elem) { $(this).height($table.find('tr:eq(' + i + ')').height()); });});CSS
.table-responsive>.fixed-column { position: absolute; display: inline-block; width: auto; border-right: 1px solid #ddd; background-color: #fff; }@media(min-width:768px) { .table-responsive>.fixed-column { display: none; }}


