登录 注册

[js] 折叠代码块

希望可以折叠代码

能否写一个代码片段来折叠过长的代码，例如 CSDN 的代码 😄

image.png

  • 思源笔记

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

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

    22250 引用 • 88929 回帖
  • 代码片段

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

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

    63 引用 • 348 回帖 • 1 关注
  • Q&A

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

    8073 引用 • 36877 回帖 • 162 关注
1 引用
[css] [js] 思源代码片段插件分享（CongSec 版） • CongSec
1 操作
JeffreyChen 在 2024-10-03 16:49:46 更新了该帖
广州 位置
100 悬赏
1 关注
2 收藏
1 引用
1 操作
25 回帖
11
11
2
385 281 1 102 1

相关帖子

被采纳的回答
25 回帖
[js] 折叠代码块

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • wilsons • • 2 评论
    付费者 捐赠者

    启用代码时对已打开的文档生效

    这个启用代码时是指打开代码片段这个开关时吗？

    image.png

    目前仅启动代码片段开关后，刷新页面，已打开的文档才会生效。

    这两个需求，后续 @EmberSky 大佬将会进一步改进。

    1 回复
    只会研究一下需求 2: 展开代码之后还需要一个按钮再次折叠
    EmberSky • • 1
    @EmberSky 嗯嗯，我改代码更新了从监听改成了 scroll 事件，发现思源大文本的时候，会有监听不到代码块被添加的情况，而且，思源会动态加载，只会显示文本的一部分，这一点要注意。
    wilsons •
  • 其他回帖
  • CongSec • • 1 评论
    付费者 捐赠者 作者

    这段代码还有一点致命的 bug，就是在运行这个代码情况下给代码块添加代码，会出现以下状况：a5b6c3a08982d7f82c07e25d4da0eb5.png48555b32e93d6dd211f798cd21c57f7.png

    4d23dcd6b4e4630de9f0cad13733d63.png

    复现这个 bug 需要刷新页面，也就是重启思源
    CongSec •
  • wilsons •
    付费者 捐赠者
    1. 折叠请等待 EmberSky 大佬的改进。
    2. 我这边无法重新你说的问题，如果问题能重复出现，请附上测试数据，并详细说明重现步骤。
      r65.gif
    3. 新版改进了，新增代码块时，思源代码块固定高度，无法滚动到底部定位光标问题。
    1 回复
    1 引用
  • CongSec •
    付费者 捐赠者 作者

    我刚才在虚拟机（一个新环境）中尝试过也是出现 bug，

    1. 随便选择一个较长代码块
    2. 运行 js 代码
    3. 退出思源
    4. 打开思源，在刚才的代码块中添加随意字符
    5. 退出思源
    6. 打开思源，你会看到会有多余的代码出现，严重的话就会出现较大的透明的框框，版本也是 3.1.7

    image.png

    2 回复
  • 查看全部回帖
CongSec
没事别关注我, 因为发帖需要更多积分 广州
回帖
158
 帖子
37
 积分
812

近期热议

推荐标签 标签

  • 知乎

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

    10 引用 • 66 回帖 • 1 关注
  • 又拍云

    又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”，乌云众测平台认证的“安全云”，为移动时代的创业者提供新一代的 CDN 加速服务。

    21 引用 • 37 回帖 • 546 关注
  • RYMCU

    RYMCU 致力于打造一个即严谨又活泼、专业又不失有趣，为数百万人服务的开源嵌入式知识学习交流平台。

    4 引用 • 6 回帖 • 53 关注
  • MySQL

    MySQL 是一个关系型数据库管理系统，由瑞典 MySQL AB 公司开发，目前属于 Oracle 公司。MySQL 是最流行的关系型数据库管理系统之一。

    685 引用 • 535 回帖
  • FlowUs

    FlowUs.息流 个人及团队的新一代生产力工具。

    让复杂的信息管理更轻松、自由、充满创意。

    1 引用 • 1 关注
  • Mobi.css

    Mobi.css is a lightweight, flexible CSS framework that focus on mobile.

    1 引用 • 6 回帖 • 740 关注
  • 单点登录

    单点登录（Single Sign On）是目前比较流行的企业业务整合的解决方案之一。SSO 的定义是在多个应用系统中，用户只需要登录一次就可以访问所有相互信任的应用系统。

    9 引用 • 25 回帖
  • 黑曜石

    黑曜石是一款强大的知识库工具，支持本地 Markdown 文件编辑，支持双向链接和关系图。

    A second brain, for you, forever.

    15 引用 • 122 回帖
  • Flume

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

    9 引用 • 6 回帖 • 628 关注
  • Postman

    Postman 是一款简单好用的 HTTP API 调试工具。

    4 引用 • 3 回帖
  • Notion

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

    6 引用 • 38 回帖
  • 博客

    记录并分享人生的经历。

    273 引用 • 2388 回帖
  • 微信

    腾讯公司 2011 年 1 月 21 日推出的一款手机通讯软件。用户可以通过摇一摇、搜索号码、扫描二维码等添加好友和关注公众平台，同时可以将自己看到的精彩内容分享到微信朋友圈。

    130 引用 • 793 回帖 • 1 关注
  • OpenStack

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

    10 引用 • 4 关注
  • 七牛云

    七牛云是国内领先的企业级公有云服务商，致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景，七牛先后推出了对象存储，融合 CDN 加速，数据通用处理，内容反垃圾服务，以及直播云服务等。

    26 引用 • 222 回帖 • 170 关注
  • LeetCode

    LeetCode（力扣）是一个全球极客挚爱的高质量技术成长平台，想要学习和提升专业能力从这里开始，充足技术干货等你来啃，轻松拿下 Dream Offer！

    209 引用 • 72 回帖
  • WebSocket

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

    48 引用 • 206 回帖 • 334 关注
  • frp

    frp 是一个可用于内网穿透的高性能的反向代理应用，支持 TCP、UDP、 HTTP 和 HTTPS 协议。

    20 引用 • 7 回帖 • 3 关注
  • Vue.js

    Vue.js（读音 /vju ː/，类似于 view）是一个构建数据驱动的 Web 界面库。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

    266 引用 • 665 回帖 • 2 关注
  • Bug

    Bug 本意是指臭虫、缺陷、损坏、犯贫、窃听器、小虫等。现在人们把在程序中一些缺陷或问题统称为 bug（漏洞）。

    75 引用 • 1737 回帖 • 4 关注
  • SOHO

    为成为自由职业者在家办公而努力吧！

    7 引用 • 55 回帖 • 21 关注
  • Google

    Google（Google Inc.，NASDAQ：GOOG）是一家美国上市公司（公有股份公司），于 1998 年 9 月 7 日以私有股份公司的形式创立，设计并管理一个互联网搜索引擎。Google 公司的总部称作“Googleplex”，它位于加利福尼亚山景城。Google 目前被公认为是全球规模最大的搜索引擎，它提供了简单易用的免费服务。不作恶（Don't be evil）是谷歌公司的一项非正式的公司口号。

    49 引用 • 192 回帖 • 2 关注
  • 运维

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

    149 引用 • 257 回帖
  • danl
    • 131 关注
  • Lute

    Lute 是一款结构化的 Markdown 引擎，支持 Go 和 JavaScript。

    25 引用 • 191 回帖 • 17 关注
  • Latke

    Latke 是一款以 JSON 为主的 Java Web 框架。

    71 引用 • 535 回帖 • 780 关注
  • Flutter

    Flutter 是谷歌的移动 UI 框架，可以快速在 iOS 和 Android 上构建高质量的原生用户界面。 Flutter 可以与现有的代码一起工作，它正在被越来越多的开发者和组织使用，并且 Flutter 是完全免费、开源的。

    39 引用 • 92 回帖 • 4 关注

最新标签