Question

我有一个表，在这个表中有一个完全复选框的列。此表将在移动设备上可见，因此如果复选框易于使用，那将会很好。所以我试图找出如何使表格单元格父，td，控制复选框的检查。因此，用户实际上并未单击复选框本身，而是单击表格单元格。为此，我为td设置了一个onclick函数，用于检查或取消选中相应的复选框。只要用户没有点击复选框本身，这就可以正常工作。如果发生这种情况，那么该框检查自身然后取消自我检查，因为它遵循它通常做的事情，然后调用自定义监听器。我尝试将复选框设置为已禁用，但在Chrome中运行时会出现一个巨大的禁止（禁止吸烟）符号。那么有没有办法让复选框作为一个整体启用但禁用它的检查功能？

编辑：

我尝试使用更高的z-index，但根本不喜欢这样。这是代码的样子：

<td style="text-align:center; width: 20%;">
        <div id="checkboxCell{{:#index}}"  onclick="PageConfigHome.toggleCheckboxes({{:#index}});" style="position:absolute; z-index: 999;">
            <input type="checkbox" style="z-index: 1" onclick="PageConfigHome.toggleCheckBoxes(null);" id="checkbox{{:#index}}" class="HomeScreenCheckbox"/>
        </div>
    </td>

解决方案： 我发现这篇帖子解决了我的问题：Tick a checkbox in a table cell by clicking anywhere in the table cell

Answer 1

您是否尝试将event传递给点击事件并使用event.stopPropagation();来阻止事件冒泡？见this

Answer 2

将绝对定位的DIV放在同一个单元格中，具有更高的z-index。将click事件放在DIV上。

由父表格单元格控制的复选框

2 个答案: