javascript - 无法使用 semantic-ui 表进行表行选择

Question

我正在尝试采用语义用户界面，但遇到了一些麻烦。我想让行选择在表格中工作。

我在下面使用他们的示例 HTML:

        <table class="ui selectable celled table">

https://jsfiddle.net/yjuoqdcy/

您可以看到将鼠标悬停在行上没有任何作用。我猜我错过了某种行为或事件连接，但我在文档中找不到太多内容。

感谢您的帮助。

Answer 1

看来您使用的是旧版本 (1.11.8) 的语义 UI 框架。升级到最新版本将使您无需自定义 CSS 即可使用行选择。

selectable table 是在 2.0.0 版中引入的。 - Release notes

<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.js"></script>

<table class="ui selectable celled table">
  <thead>
    <tr>
      <th>Name</th>
      <th>Status</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>John</td>
      <td>No Action</td>
    </tr>
    <tr>
      <td>Jamie</td>
      <td>Approved</td>
    </tr>
    <tr>
      <td>Jill</td>
      <td>Denied</td>
    </tr>
  </tbody>
</table>