如何使用引导程序在表格单元格 (td) 上的下拉菜单?



我有一个简单的html表,用引导程序布局:

[...]
<td data-toggle="dropdown" class="tag dropdown-toggle">
<span class="number">Employee1</span>
<ul class="dropdown-menu"><li><a href="#">to nightshift</a></li>
</ul>
</td>
[...]

但是当我单击单元格时,下拉菜单没有出现。如何让下拉列表看起来像在这里完成的那样?

https://www.w3schools.com/bootstrap/bootstrap_dropdowns.asp

我需要手动收听td.click吗?

我认为

这对您的问题很有帮助。您错过了父下拉类,并在样式表中添加了以下 css。

.html

<tr class="dropdown">
    <td class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">John <span class="caret"></span>
      <ul class="dropdown-menu">
        <li><a href="#">HTML</a></li>
        <li><a href="#">CSS</a></li>
        <li><a href="#">JavaScript</a></li>
      </ul>
    </td>
    <td>Doe</td>
    <td>john@example.com</td>
  </tr>

.css

.open ul.dropdown-menu {
    display: block;
}

最新更新