希望可以通过 方向键 ←→ 快速切换不同分组 而不是现在的仅可以支持 ↑↓
每一个框住的可以做一个分组
使用主题 Asri
有一个大概的思路
这个主题会在分组的中间添加一个 b3-menu__separator
标记 b3-menu__separator 的位置, 如果触发了 ← → 则将焦点跳转到当前焦点的下一个 b3-menu__separator 位置的下一个 button 位置
-
思源笔记
23108 引用 • 93049 回帖 • 1 关注
思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。
融合块、大纲和双向链接，重构你的思维。
-
Q&A
8498 引用 • 38735 回帖 • 153 关注
提问之前请先看《提问的智慧》，好的问题比好的答案更有价值。
1 操作
Muu
在 2024-08-13 17:12:43 更新了该帖
相关帖子
被采纳的回答
-
wilsons • • 2 • 1 赞同付费者 捐赠者
这个主题会在分组的中间添加一个
b3-menu__separator仅在未筛选时才加这个
b3-menu__separator, 筛选时是没有分组的，比如你输入/j或/gj就知道了。不过，在无分组情况下，我通过
skipElementNumInSearch = 3模拟实现了，这个变量的作用是，在没有分组情况下，按方向键跳过几个元素（如下图第二个 GIF 所示）。效果如下
有分组效果
无分组效果
代码
注意事项
由于左右方向键和思源的左右方向键冲突，这里采用了一些技巧，避开了这些问题，但不保证后续有没有别的问题，理论上应该问题不大。如果发现有兼容问题，可以开启
useCompatibilityMode = true，使用兼容模式，但兼容模式需要用ctrl/cmd+左右方向键代替，可能体验较差。最后提醒下，保存后刷新下页面，确保脚本正确执行。
祝你好运 🍀
请输入回帖内容
...
-
这个主题会在分组的中间添加一个
b3-menu__separator仅在未筛选时才加这个
b3-menu__separator, 筛选时是没有分组的，比如你输入/j或/gj就知道了。不过，在无分组情况下，我通过
skipElementNumInSearch = 3模拟实现了，这个变量的作用是，在没有分组情况下，按方向键跳过几个元素（如下图第二个 GIF 所示）。效果如下
有分组效果
无分组效果
代码
注意事项
由于左右方向键和思源的左右方向键冲突，这里采用了一些技巧，避开了这些问题，但不保证后续有没有别的问题，理论上应该问题不大。如果发现有兼容问题，可以开启
useCompatibilityMode = true，使用兼容模式，但兼容模式需要用ctrl/cmd+左右方向键代替，可能体验较差。最后提醒下，保存后刷新下页面，确保脚本正确执行。
祝你好运 🍀
2 回复 - 其他回帖
-
@wilsons 大佬 可以根据这个思路进行下重构么?
// 对于没有分组的其实可以动态获取每一列的button数量 const menu = document.querySelector(".hint--menu:not(.fn__none)"); const b3Item = document.querySelector(".hint--menu .b3-list-item"); const b3ItemStyle = window.getComputedStyle(b3Item) const lineHeight = +b3ItemStyle.lineHeight.slice(0,-2) const marginBottom = +b3ItemStyle.marginBottom.slice(0,-2) // 这里有个问题 如果每一列只会有一个选项看注释是禁用的 // 但是这里其实应该还是可以启用下 // 其他思路: 感觉其实可以根据这个进行一个虚拟分组, 而不是直接跳过n个元素 skipElementNumInSearch = Math.floor(menu.offsetHeight / (lineHeight + marginBottom)) - 1 // 搭配css 片段 .hint--menu:not(.fn__none) > div > button:nth-child(1) { margin-top: 0; }1 回复 - 查看全部回帖