求助大佬帮完善个 js,在移动端页面上侧工具栏再添加一个按钮,实现复制块超链接功能

setTimeout(() => {
    if(!window.siyuan?.mobile) return;
    const targetButton = document.querySelector('#editor .protyle-breadcrumb [data-type="exit-focus"]');
    if (!targetButton) return;
    targetButton.insertAdjacentHTML('afterend', `<a class="block__icon fn__flex-center ariaLabel" aria-label="链接2" data-type="link2" href="siyuan://blocks/20250627184916-xhmqiqj"><svg><use xlink:href="#iconOpenWindow"></use></svg></a>`);
    const link2 = targetButton.nextElementSibling;
    targetButton.insertAdjacentHTML('afterend', `<a class="block__icon fn__flex-center ariaLabel" aria-label="链接" data-type="link" href="siyuan://blocks/20250627184916-xhmqiqj"><svg><use xlink:href="#iconOpenWindow"></use></svg></a>`);
    const link = targetButton.nextElementSibling;
    targetButton.insertAdjacentHTML('afterend', `<button class="block__icon fn__flex-center ariaLabel" aria-label="大纲" data-type="outline"><svg><use xlink:href="#iconAlignCenter"></use></svg></button>`);
    const outline = targetButton.nextElementSibling;
    targetButton.insertAdjacentHTML('afterend', `<button class="block__icon fn__flex-center ariaLabel" aria-label="文档树" data-type="docTree"><svg><use xlink:href="#iconFiles"></use></svg></button>`);
    const tree = targetButton.nextElementSibling;
    link.addEventListener('click', ()=>{
        // 在这里修改你的块id 👇👇👇
        openBlock('20250519181309-2n6qhdj');
    });
    link2.addEventListener('click', ()=>{
        // 在这里修改你的块id 👇👇👇
        openBlock('20250807172700-e1jsytg');
    });
    tree.addEventListener('click', ()=>{
        click('#toolbarFile');
        click('[data-type="sidebar-file-tab"]');
    });
    outline.addEventListener('click', ()=>{
        click('#toolbarFile');
        click('[data-type="sidebar-outline-tab"]');
    });
    function click(el) {
        if(typeof el === 'string') el = document.querySelector(el);
        el.dispatchEvent(new MouseEvent('click', {
            bubbles: true,
            cancelable: true,
            view: window
        }));
    }
    function openBlock(id) {
        const wysiwyg = document.querySelector('#editor .protyle-wysiwyg');
        if(!wysiwyg) return;
        const html = `<span class="protyle-custom open-block-link" data-type="a" data-href="siyuan://blocks/${id}" style="display:none;"></span>`;
        wysiwyg.insertAdjacentHTML('beforeend', html);
        const link = wysiwyg.querySelector('.open-block-link');
        link.click();
        link.remove();
    }
}, 2000);
  • 思源笔记

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

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

    28446 引用 • 119776 回帖
  • Q&A

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

    11155 引用 • 50658 回帖 • 52 关注

相关帖子

欢迎来到这里!

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

注册 关于
请输入回帖内容 ...
  • zizi

    大佬威武,现在直接复制块超链接,便建立一个链接点,优于我的预期了(我原本设想是先复制块超链接、再手动复制到一个关键词上,现在帮我把手动复制超链接到关键词的步骤省掉了)

  • 其他回帖
  • zizi

    用了这个段代码,在安卓手机端上面窗口处没有出现新的按钮。

    这个按钮想要实现复制块超链接功能。

    1 回复
  • 你不都实现了吗?无非多加一个复制到剪切板而已,把 openBlock()换成 copyPlainText()即可。

    要想兼容性好,可以使用下面的代码

    async function copyPlainText (text) {
        text = text.replace(new RegExp("\u200b", "g"), ""); // `复制纯文本` 时移除所有零宽空格 https://github.com/siyuan-note/siyuan/issues/6674
        await writeText(text);
    }
    
    // see https://github.com/siyuan-note/siyuan/blob/5f0f4e3ba6aabd5af26f9879695e5b9b796b5fb9/app/src/protyle/util/compatibility.ts#L129C14-L129C24
    function writeText(text) {
        let range;
        if (getSelection().rangeCount > 0) {
            range = getSelection().getRangeAt(0).cloneRange();
        }
        try {
            // navigator.clipboard.writeText 抛出异常不进入 catch,这里需要先处理移动端复制
            if (isInAndroid()) {
                window.JSAndroid.writeClipboard(text);
                return;
            }
            if (isInHarmony()) {
                window.JSHarmony.writeClipboard(text);
                return;
            }
            if (isInIOS()) {
                window.webkit.messageHandlers.setClipboard.postMessage(text);
                return;
            }
            navigator.clipboard.writeText(text);
        } catch (e) {
            if (isInIOS()) {
                window.webkit.messageHandlers.setClipboard.postMessage(text);
            } else if (isInAndroid()) {
                window.JSAndroid.writeClipboard(text);
            } else if (isInHarmony()) {
                window.JSHarmony.writeClipboard(text);
            } else {
                const textElement = document.createElement("textarea");
                textElement.value = text;
                textElement.style.position = "fixed";  //avoid scrolling to bottom
                document.body.appendChild(textElement);
                textElement.focus();
                textElement.select();
                document.execCommand("copy");
                document.body.removeChild(textElement);
                if (range) {
                    focusByRange(range);
                }
            }
        }
        function isInAndroid() {
            return window.siyuan.config.system.container === "android" && window.JSAndroid;
        }
        function isInIOS() {
            return window.siyuan.config.system.container === "ios" && window.webkit?.messageHandlers;
        }
        function isInHarmony() {
            return window.siyuan.config.system.container === "harmony" && window.JSHarmony;
        }
    }
    

    调用方式,比如复制块超级链接

    await copyPlainText(`siyuan://blocks/20250807172700-e1jsytg`);

    复制为 Markdown 链接

    await copyPlainText(`[你的块内容](siyuan://blocks/20250807172700-e1jsytg)`);

    1 回复
  • 查看全部回帖

推荐标签 标签

  • AWS
    11 引用 • 28 回帖 • 1 关注
  • 新人

    让我们欢迎这对新人。哦,不好意思说错了,让我们欢迎这位新人!
    新手上路,请谨慎驾驶!

    52 引用 • 228 回帖
  • Windows

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

    232 引用 • 484 回帖 • 1 关注
  • CSDN

    CSDN (Chinese Software Developer Network) 创立于 1999 年,是中国的 IT 社区和服务平台,为中国的软件开发者和 IT 从业者提供知识传播、职业发展、软件开发等全生命周期服务,满足他们在职业发展中学习及共享知识和信息、建立职业发展社交圈、通过软件开发实现技术商业化等刚性需求。

    14 引用 • 155 回帖
  • Spark

    Spark 是 UC Berkeley AMP lab 所开源的类 Hadoop MapReduce 的通用并行框架。Spark 拥有 Hadoop MapReduce 所具有的优点;但不同于 MapReduce 的是 Job 中间输出结果可以保存在内存中,从而不再需要读写 HDFS,因此 Spark 能更好地适用于数据挖掘与机器学习等需要迭代的 MapReduce 的算法。

    74 引用 • 46 回帖 • 563 关注
  • Oracle

    Oracle(甲骨文)公司,全称甲骨文股份有限公司(甲骨文软件系统有限公司),是全球最大的企业级软件公司,总部位于美国加利福尼亚州的红木滩。1989 年正式进入中国市场。2013 年,甲骨文已超越 IBM,成为继 Microsoft 后全球第二大软件公司。

    107 引用 • 127 回帖 • 329 关注
  • uTools

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

    9 引用 • 75 回帖
  • WebSocket

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

    48 引用 • 206 回帖 • 285 关注
  • 运维

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

    151 引用 • 257 回帖 • 1 关注
  • V2Ray
    1 引用 • 15 回帖 • 4 关注
  • OpenStack

    OpenStack 是一个云操作系统,通过数据中心可控制大型的计算、存储、网络等资源池。所有的管理通过前端界面管理员就可以完成,同样也可以通过 Web 接口让最终用户部署资源。

    10 引用 • 8 关注
  • Vim

    Vim 是类 UNIX 系统文本编辑器 Vi 的加强版本,加入了更多特性来帮助编辑源代码。Vim 的部分增强功能包括文件比较(vimdiff)、语法高亮、全面的帮助系统、本地脚本(Vimscript)和便于选择的可视化模式。

    29 引用 • 66 回帖
  • abitmean

    有点意思就行了

    44 关注
  • Notion

    Notion - The all-in-one workspace for your notes, tasks, wikis, and databases.

    10 引用 • 80 回帖 • 1 关注
  • jsoup

    jsoup 是一款 Java 的 HTML 解析器,可直接解析某个 URL 地址、HTML 文本内容。它提供了一套非常省力的 API,可通过 DOM,CSS 以及类似于 jQuery 的操作方法来取出和操作数据。

    6 引用 • 1 回帖 • 516 关注
  • SpaceVim

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

    3 引用 • 31 回帖 • 120 关注
  • TensorFlow

    TensorFlow 是一个采用数据流图(data flow graphs),用于数值计算的开源软件库。节点(Nodes)在图中表示数学操作,图中的线(edges)则表示在节点间相互联系的多维数据数组,即张量(tensor)。

    20 引用 • 19 回帖
  • Office

    Office 现已更名为 Microsoft 365. Microsoft 365 将高级 Office 应用(如 Word、Excel 和 PowerPoint)与 1 TB 的 OneDrive 云存储空间、高级安全性等结合在一起,可帮助你在任何设备上完成操作。

    6 引用 • 35 回帖
  • Sym

    Sym 是一款用 Java 实现的现代化社区(论坛/BBS/社交网络/博客)系统平台。

    下一代的社区系统,为未来而构建

    524 引用 • 4602 回帖 • 731 关注
  • Ngui

    Ngui 是一个 GUI 的排版显示引擎和跨平台的 GUI 应用程序开发框架,基于
    Node.js / OpenGL。目标是在此基础上开发 GUI 应用程序可拥有开发 WEB 应用般简单与速度同时兼顾 Native 应用程序的性能与体验。

    7 引用 • 9 回帖 • 429 关注
  • LaTeX

    LaTeX(音译“拉泰赫”)是一种基于 ΤΕΧ 的排版系统,由美国计算机学家莱斯利·兰伯特(Leslie Lamport)在 20 世纪 80 年代初期开发,利用这种格式,即使使用者没有排版和程序设计的知识也可以充分发挥由 TeX 所提供的强大功能,能在几天,甚至几小时内生成很多具有书籍质量的印刷品。对于生成复杂表格和数学公式,这一点表现得尤为突出。因此它非常适用于生成高印刷质量的科技和数学类文档。

    14 引用 • 84 回帖
  • Redis

    Redis 是一个开源的使用 ANSI C 语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value 数据库,并提供多种语言的 API。从 2010 年 3 月 15 日起,Redis 的开发工作由 VMware 主持。从 2013 年 5 月开始,Redis 的开发由 Pivotal 赞助。

    285 引用 • 248 回帖
  • 以太坊

    以太坊(Ethereum)并不是一个机构,而是一款能够在区块链上实现智能合约、开源的底层系统。以太坊是一个平台和一种编程语言 Solidity,使开发人员能够建立和发布下一代去中心化应用。 以太坊可以用来编程、分散、担保和交易任何事物:投票、域名、金融交易所、众筹、公司管理、合同和知识产权等等。

    34 引用 • 367 回帖 • 1 关注
  • Rust

    Rust 是一门赋予每个人构建可靠且高效软件能力的语言。Rust 由 Mozilla 开发,最早发布于 2014 年 9 月。

    60 引用 • 22 回帖 • 2 关注
  • OpenCV
    15 引用 • 36 回帖 • 1 关注
  • 千千插件

    千千块(自定义块 css 和 js)
    可以用 ai 提示词来无限创作思源笔记

    32 引用 • 69 回帖
  • Ant-Design

    Ant Design 是服务于企业级产品的设计体系,基于确定和自然的设计价值观上的模块化解决方案,让设计者和开发者专注于更好的用户体验。

    17 引用 • 23 回帖 • 10 关注