下午就要期末考试了,我已经准备好了复习题和答案,如下图:
我是通过块引脚注插件来引用答案的
每次我想快速滑动答案的时候,老是容易划到下一个答案,希望可以像悬浮窗口那样,点击的时候自动聚焦这个答案
为什么不选择悬浮窗口呢?
因为
- 窗口太小了,每次都要调整
- 悬浮需要消耗时间,希望不能快速查看某一个答案
故有没有大佬可以写一个 js 代码片段,点击引用自动聚焦,以排除其他块内容的影响
下午就要期末考试了,我已经准备好了复习题和答案,如下图:
我是通过块引脚注插件来引用答案的
每次我想快速滑动答案的时候,老是容易划到下一个答案,希望可以像悬浮窗口那样,点击的时候自动聚焦这个答案
为什么不选择悬浮窗口呢?
因为
故有没有大佬可以写一个 js 代码片段,点击引用自动聚焦,以排除其他块内容的影响
思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。
融合块、大纲和双向链接,重构你的思维。
提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。
超级块和普通情况不同,它无法在光标处于文本区域时按 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);
说明:超级块不用触发快捷键,普通块需要触发快捷键。
你查看答案是按 alt+ 点击 分屏查看吗?
如果是的话 openAny 可以实现,代码如下:
openAny.setKeymap('alt+mouseleft', async (event, {whenElementExist}) => {
const el = await whenElementExist('[data-node-id].protyle-wysiwyg--hl');
openAny.press('alt+arrowright', el);
});
须知,凡是手动能操作的,大多数情况 openAny 也可以。
补充:
openAny 代码片段下载地址
正如 J 佬所说,你代码片段没开启。
不要放到 openAny.js 里面,会报错的。
如果不需要分屏,可以用下面的代码,支持手机和 pc。
setTimeout(()=>{
openAny.setKeymap('mouseleft', async (event, {whenElementExist}) => {
if(!event.target.closest('[data-type="block-ref"]')) return;
const el = await whenElementExist('[data-node-id].protyle-wysiwyg--hl');
openAny.press('alt+arrowright', el);
});
}, 2000);
目前仅支持引用,不支持链接等,如果想支持链接,可以改下 这里的限制即可
if(!event.target.matches('[data-type="block-ref"]')) return;
比如,下面的代码同时支持引用和链接
if(!event.target.closest('[data-type="block-ref"],[data-type="a"]')) return;
超级块和普通情况不同,它无法在光标处于文本区域时按 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);
说明:超级块不用触发快捷键,普通块需要触发快捷键。
确认过眼神后的灵魂连接,站在链在!
Quicker 您的指尖工具箱!操作更少,收获更多!
为成为自由职业者在家办公而努力吧!
Communication channel for makers and users.
这是一个不能说的秘密。
Chrome 又称 Google 浏览器,是一个由谷歌公司开发的网页浏览器。该浏览器是基于其他开源软件所编写,包括 WebKit,目标是提升稳定性、速度和安全性,并创造出简单且有效率的使用者界面。
Python 是一种面向对象、直译式电脑编程语言,具有近二十年的发展历史,成熟且稳定。它包含了一组完善而且容易理解的标准库,能够轻松完成很多常见的任务。它的语法简捷和清晰,尽量使用无异义的英语单词,与其它大多数程序设计语言使用大括号不一样,它使用缩进来定义语句块。
一些有用的避坑指南。
网络爬虫(Spider、Crawler),是一种按照一定的规则,自动地抓取万维网信息的程序。
星期六到星期天晚,实行五天工作制后,指每周的最后两天。再过几年可能就是三天了。
GitBook 使您的团队可以轻松编写和维护高质量的文档。 分享知识,提高团队的工作效率,让用户满意。
小说是以刻画人物形象为中心,通过完整的故事情节和环境描写来反映社会生活的文学体裁。
SpaceVim 是一个社区驱动的模块化 vim/neovim 配置集合,以模块的方式组织管理插件以
及相关配置,为不同的语言开发量身定制了相关的开发模块,该模块提供代码自动补全,
语法检查、格式化、调试、REPL 等特性。用户仅需载入相关语言的模块即可得到一个开箱
即用的 Vim-IDE。
Vue.js(读音 /vju ː/,类似于 view)是一个构建数据驱动的 Web 界面库。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
gzip (GNU zip)是 GNU 自由软件的文件压缩程序。我们在 Linux 中经常会用到后缀为 .gz 的文件,它们就是 Gzip 格式的。现今已经成为互联网上使用非常普遍的一种数据压缩格式,或者说一种文件格式。
Lute 是一款结构化的 Markdown 引擎,支持 Go 和 JavaScript。
WebSocket 是 HTML5 中定义的一种新协议,它实现了浏览器与服务器之间的全双工通信(full-duplex)。
Latke 是一款以 JSON 为主的 Java Web 框架。
我们平时所说的“架构”主要是指软件架构,这是有关软件整体结构与组件的抽象描述,用于指导软件系统各个方面的设计。另外还有“业务架构”、“网络架构”、“硬件架构”等细分领域。
Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台,它支持多种框架、语言、运行时环境、云平台及应用服务,使开发人员能够在几秒钟内进行应用程序的部署和扩展,无需担心任何基础架构的问题。
Shell 脚本与 Windows/Dos 下的批处理相似,也就是用各类命令预先放入到一个文件中,方便一次性执行的一个程序文件,主要是方便管理员进行设置或者管理用的。但是它比 Windows 下的批处理更强大,比用其他编程程序编辑的程序效率更高,因为它使用了 Linux/Unix 下的命令。
小薇是一个用 Java 写的 QQ 聊天机器人 Web 服务,可以用于社群互动。
由于 Smart QQ 从 2019 年 1 月 1 日起停止服务,所以该项目也已经停止维护了!
又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”,乌云众测平台认证的“安全云”,为移动时代的创业者提供新一代的 CDN 加速服务。
有空闲时间是接外包好呢还是学习好呢?
钉钉,专为中国企业打造的免费沟通协同多端平台, 阿里巴巴出品。