SAPSAP 实用篇

SAP Spartacus org unit table不同区域

2021-02-19  本文已影响0人  华山令狐冲

第一版table:

<html>
<body>
<table>
<thead>
    <tr>
        <th>
            Name
        </th>
        <th>
            Value
        </th>
    </tr>
</thead>
<tr>
<td>
    This is Jerry's very long name
</td>
<td>
    1
</td>
</tr>

<tr>
<td>
    This is Tom's very long name
</td>
<td>
    2
</td>
</tr>

</table>
</body>
</html>

结果:

试了一下,发现td获得不到焦点。网上查了一下,发现csdn这个帖子:说td获取不到焦点。

https://ask.csdn.net/questions/380408

只能手动在Chrome里设置focus,为何?


a标签设置href属性之后,就能正常接收键盘的tab触发的focus事件了:


再做做修改:
加上tr:focus-within:

结果:

需求:有没有可能让tr保持选中状态,但是里面的<a>的蓝色border不出现呢?

这种方式可以:

效果:但是side effect比较大,这样所有的a focus之后都没有效果了:

使用tabindex='0'即可解决问题。

第一次按tab:

第二次按tab:

第三次按tab:

更多Jerry的原创文章,尽在:"汪子熙":


上一篇 下一篇

猜你喜欢

热点阅读