登录 注册

希望可以点击块引自动聚焦

下午就要期末考试了，我已经准备好了复习题和答案，如下图：

我是通过块引脚注插件来引用答案的

image.png

每次我想快速滑动答案的时候，老是容易划到下一个答案，希望可以像悬浮窗口那样，点击的时候自动聚焦这个答案

image.png

为什么不选择悬浮窗口呢？

因为

  1. 窗口太小了，每次都要调整
  2. 悬浮需要消耗时间，希望不能快速查看某一个答案

故有没有大佬可以写一个 js 代码片段，点击引用自动聚焦，以排除其他块内容的影响

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。

    融合块、大纲和双向链接，重构你的思维。

    25701 引用 • 106324 回帖
  • Q&A

    提问之前请先看《提问的智慧》，好的问题比好的答案更有价值。

    9847 引用 • 44749 回帖 • 83 关注
2 引用
叶归｜演示一下侧边批注的效果 • CongSec
[js] 第二弹，openAny 教程之全局搜索仅搜文档 / 快速灵感输入 / 快速显示隐藏侧边栏等 • wilsons
1 操作
CongSec 在 2025-05-06 23:03:51 更新了该帖
北京 位置
2 引用
1 操作
9 回帖
4
3
2
220 71 25 1 123

相关帖子

被采纳的回答
  • wilsons •
    付费者 捐赠者

    超级块和普通情况不同，它无法在光标处于文本区域时按 alt+ 右方向键触发聚焦，必须点击超级图标才行。所以，这里使用了 mouseover 模拟出超级块图标。
    又因为这个聚焦产生的焦点无法用 requestAnimationFrame 监听，所以这里先用 while 和 sleep 替代。

    修改后的代码如下（兼容超级块和普通块）：

    setTimeout(()=>{ // 兼容超级和普通块
   openAny.setKeymap('mouseleft', async (event, {sleep}) => {
        if(!event.target.closest('[data-type~="block-ref"]')) return;
        let el; const start = Date.now();
        while(!el){
            if (Date.now() - start > 5000) {console.warn('获取聚焦块元素失败');break;}
            el = document.querySelector('[data-node-id].protyle-wysiwyg--hl')
            await sleep(40);
        }
        if(el.closest('.sb')){ // 超级块
            openAny.press('mouseover', el.firstElementChild.querySelector('[contenteditable="true"]'));
            const superBtn = await whenElementExist(()=>document.querySelector('use[*|href="#iconSuper"]')?.closest('button'));
            openAny.click(superBtn).click('#commonMenu [data-id="enter"]');
        } else { // 普通块
            openAny.press('alt+arrowright', el);
        }
    }); 
}, 2000);
​

    说明：超级块不用触发快捷键，普通块需要触发快捷键。

9 回帖
希望可以点击块引自动聚焦

欢迎来到这里！

我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。

注册 关于
请输入回帖内容 ...
  • CongSec •
    付费者 捐赠者 作者

    虽然可以跳转块引用的时候实现聚焦，但好像对超级块不受影响，无法聚焦，以下是我的测试文档（块引脚注插件制作的块引用）：密码学复习.sy1.zip

    1 回复
  • 其他回帖
  • CongSec •
    付费者 捐赠者 作者

    没有，我是打开过的，但我新开了一个空间，将你的两段代码导入，发现可行，但是为什么在我原来的空间不行了？然后我想是 css，js 和插件的原因，结果我全部关闭了，还是不行，然后我觉得应该是设置的原因，然后将旧空间的设置导入到新空间，发现新空间不行了，你这两段代码运行需要用什么快捷键或者是开启某些设置之类的？

    2 回复
  • wilsons • • 1 评论
    付费者 捐赠者

    是的，正如 J 佬所说，需要默认快捷键是 alt + ->。

    你检查下聚焦快捷键是否与改过或与其他快捷键有冲突，如果是，可以把 openAny.press('alt+arrowright', el);改成你自己的快捷键即可。

    如果你改后不行，我在改成其他方式调用聚焦，不过快捷键最方便了。

    不是，我是说可以实现聚焦，但超级块无法实现聚焦
    CongSec •
  • JeffreyChen •
    付费者 支持者 捐赠者

    你截图里没打开代码片段的开关

  • 查看全部回帖
CongSec
新手可以看我发的求助帖以及汇总帖子，很有帮助的!_! 网安笔记分享：http://congsec.xyz 北京
回帖
315
 帖子
79
 积分
234

近期热议

推荐标签 标签

  • Kubernetes

    Kubernetes 是 Google 开源的一个容器编排引擎，它支持自动化部署、大规模可伸缩、应用容器化管理。

    118 引用 • 54 回帖 • 1 关注
  • 知乎

    知乎是网络问答社区，连接各行各业的用户。用户分享着彼此的知识、经验和见解，为中文互联网源源不断地提供多种多样的信息。

    10 引用 • 66 回帖
  • 心情

    心是产生任何想法的源泉，心本体会陷入到对自己本体不能理解的状态中，因为心能产生任何想法，不能分出对错，不能分出自己。

    59 引用 • 369 回帖
  • Windows

    Microsoft Windows 是美国微软公司研发的一套操作系统，它问世于 1985 年，起初仅仅是 Microsoft-DOS 模拟环境，后续的系统版本由于微软不断的更新升级，不但易用，也慢慢的成为家家户户人们最喜爱的操作系统。

    227 引用 • 476 回帖
  • 微软

    微软是一家美国跨国科技公司，也是世界 PC 软件开发的先导，由比尔·盖茨与保罗·艾伦创办于 1975 年，公司总部设立在华盛顿州的雷德蒙德（Redmond，邻近西雅图）。以研发、制造、授权和提供广泛的电脑软件服务业务为主。

    8 引用 • 44 回帖
  • 资讯

    资讯是用户因为及时地获得它并利用它而能够在相对短的时间内给自己带来价值的信息，资讯有时效性和地域性。

    56 引用 • 85 回帖
  • 链滴

    链滴是一个记录生活的地方。

    记录生活，连接点滴

    177 引用 • 3865 回帖 • 1 关注
  • 服务器

    服务器，也称伺服器，是提供计算服务的设备。由于服务器需要响应服务请求，并进行处理，因此一般来说服务器应具备承担服务并且保障服务的能力。

    125 引用 • 585 回帖
  • 运维

    互联网运维工作，以服务为中心，以稳定、安全、高效为三个基本点，确保公司的互联网业务能够 7×24 小时为用户提供高质量的服务。

    151 引用 • 257 回帖
  • Flume

    Flume 是一套分布式的、可靠的，可用于有效地收集、聚合和搬运大量日志数据的服务架构。

    9 引用 • 6 回帖 • 655 关注
  • RabbitMQ

    RabbitMQ 是一个开源的 AMQP 实现，服务器端用 Erlang 语言编写，支持多种语言客户端，如：Python、Ruby、.NET、Java、C、PHP、ActionScript 等。用于在分布式系统中存储转发消息，在易用性、扩展性、高可用性等方面表现不俗。

    49 引用 • 60 回帖 • 347 关注
  • NGINX

    NGINX 是一个高性能的 HTTP 和反向代理服务器，也是一个 IMAP/POP3/SMTP 代理服务器。 NGINX 是由 Igor Sysoev 为俄罗斯访问量第二的 Rambler.ru 站点开发的，第一个公开版本 0.1.0 发布于 2004 年 10 月 4 日。

    315 引用 • 547 回帖
  • jsDelivr

    jsDelivr 是一个开源的 CDN 服务，可为 npm 包、GitHub 仓库提供免费、快速并且可靠的全球 CDN 加速服务。

    5 引用 • 31 回帖 • 106 关注
  • JetBrains

    JetBrains 是一家捷克的软件开发公司，该公司位于捷克的布拉格，并在俄国的圣彼得堡及美国麻州波士顿都设有办公室，该公司最为人所熟知的产品是 Java 编程语言开发撰写时所用的集成开发环境：IntelliJ IDEA。

    18 引用 • 54 回帖
  • Love2D

    Love2D 是一个开源的， 跨平台的 2D 游戏引擎。使用纯 Lua 脚本来进行游戏开发。目前支持的平台有 Windows, Mac OS X, Linux, Android 和 iOS。

    14 引用 • 53 回帖 • 556 关注
  • Maven

    Maven 是基于项目对象模型（POM）、通过一小段描述信息来管理项目的构建、报告和文档的软件项目管理工具。

    188 引用 • 319 回帖 • 250 关注
  • 代码片段

    代码片段分为 CSS 与 JS 两种代码，添加在 [设置 - 外观 - 代码片段] 中，这些代码会在思源笔记加载时自动执行，用于改善笔记的样式或功能。

    用户在该标签下分享代码片段时需在帖子标题前添加 [css] 或 [js] 用于区分代码片段类型。

    173 引用 • 1202 回帖
  • gRpc
    11 引用 • 9 回帖 • 95 关注
  • Sandbox

    如果帖子标签含有 Sandbox ，则该帖子会被视为“测试帖”，主要用于测试社区功能，排查 bug 等，该标签下内容不定期进行清理。

    438 引用 • 1250 回帖 • 593 关注
  • Eclipse

    Eclipse 是一个开放源代码的、基于 Java 的可扩展开发平台。就其本身而言，它只是一个框架和一组服务，用于通过插件组件构建开发环境。

    76 引用 • 258 回帖 • 626 关注
  • Unity

    Unity 是由 Unity Technologies 开发的一个让开发者可以轻松创建诸如 2D、3D 多平台的综合型游戏开发工具，是一个全面整合的专业游戏引擎。

    25 引用 • 7 回帖 • 123 关注
  • SpaceVim

    SpaceVim 是一个社区驱动的模块化 vim/neovim 配置集合，以模块的方式组织管理插件以
    及相关配置，为不同的语言开发量身定制了相关的开发模块，该模块提供代码自动补全，
    语法检查、格式化、调试、REPL 等特性。用户仅需载入相关语言的模块即可得到一个开箱
    即用的 Vim-IDE。

    3 引用 • 31 回帖 • 112 关注
  • Telegram

    Telegram 是一个非盈利性、基于云端的即时消息服务。它提供了支持各大操作系统平台的开源的客户端，也提供了很多强大的 APIs 给开发者创建自己的客户端和机器人。

    5 引用 • 35 回帖 • 1 关注
  • Hexo

    Hexo 是一款快速、简洁且高效的博客框架，使用 Node.js 编写。

    22 引用 • 148 回帖 • 10 关注
  • Typecho

    Typecho 是一款博客程序，它在 GPLv2 许可证下发行，基于 PHP 构建，可以运行在各种平台上，支持多种数据库（MySQL、PostgreSQL、SQLite）。

    12 引用 • 67 回帖 • 449 关注
  • uTools

    uTools 是一个极简、插件化、跨平台的现代桌面软件。通过自由选配丰富的插件，打造你得心应手的工具集合。

    7 引用 • 27 回帖 • 2 关注
  • WebSocket

    WebSocket 是 HTML5 中定义的一种新协议，它实现了浏览器与服务器之间的全双工通信（full-duplex）。

    48 引用 • 206 回帖 • 290 关注

最新标签