我正在尝试重新创建 demo
我的jsfiddle是here
前端 JavaScript
$(document).ready(function() {
$('#example').DataTable({
responsive: {
details: {
type: 'column',
target: 'tr'
}
},
columnDefs: [{
className: 'control',
orderable: false,
targets: 0
}],
order: [1, 'asc']
});
});
HTML
<table id="example" class="display nowrap" width="100%">
<thead>
<tr>
<th></th>
<th>test</th>
<th>test</th>
<th>test</th>
<th>test</th>
<th>test</th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
</tbody>
</table>
由于未知原因,详细信息行没有出现(最左边一列的 +/- 符号也没有出现)
我做错了什么?
最佳答案
您有两个问题:
- 您没有使用正确的库
- 您正在使用响应式扩展程序,该扩展程序会根据宽度自动隐藏数据。因此您必须添加更多列,以免数据溢出。
查看更新后的JSfiddle 。
Look at the used external resources to see the correct libraries to import.
关于javascript - 数据表子行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46902428/