无法展开和折叠子行
无法展开和折叠子行
提问于 2018-07-17 20:03:08
我使用basic datatable打印从后端接收到的动态值。对于每个行，我还有一个隐藏的子行，其中包含该父行的一些附加值。在每个父行中都有一个按钮，我希望在单击该链接时，该父行的子行应该展开并对用户可见。这应该发生在每个作为fiddle的row.Here上
但是，当我单击该按钮时，子行并未打开。有谁能帮我解决这个问题吗？
$('table').on('click', 'tr.parent .det', function() {
$(this).closest('tr.cchild').toggleClass('open');
});.cchild {
display: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="example" class="display" style="width:100%">
<thead>
<tr>
<th>Name</th>
<th>Location</th>
<th>Experience</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php foreach($per_job as $job): ?>
<tr class="parent">
<td>
<?php echo $job->name; ?>
</td>
<td>
<?php echo $job->location; ?>
</td>
<td>
<?php echo $job->experience; ?>
</td>
<td>
<button class="show-btn rd-details det">
DETAILS
</button>
</td>
</tr>
<tr class="cchild">
<td>
<?php echo $job->age; ?>
</td>
<td>
<?php echo $job->class; ?>
</td>
<td>
<?php echo $job->address; ?>
</td>
<td>
<?php echo $job->number; ?>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
Stack Overflow用户
发布于 2018-07-17 20:11:04
据我所知，您还没有在任何地方定义开放的类，所以只需在现有的CSS中定义该类即可。
.open{
display:block !important;
}display属性指定是否/如何显示元素。
每个display元素都有一个默认的HTML值，这取决于它是什么类型的元素。大多数元素的缺省display值是block或inline。当您声明一个对象具有display none时，就像您使用cchild的CSS所做的那样，代码隐藏了该对象。
现在，要显示您的对象，您可以删除现有的类或使用另一个类或样式覆盖现有的类。为此，您可以使用切换类open，该类应该具有display 'block‘。在简单的语言中，您是在显示和隐藏对象。更多信息可以在here上找到。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51380902
复制相关文章
相似问题
腾讯云开发者
