Home Sign Up Sign In
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
Xianmua
V2EX  ›  程序员

分享个 V2EX 楼中楼脚本，完全基于本地实现

  •  2      
  •   Xianmua · May 22, 2023 · 4834 views
    This topic created in 1119 days ago, the information mentioned may be changed or developed.

    会在可以生成楼中楼的回复右下角，生成一个小蜘蛛网按钮

    点一下即可悬浮窗显示当前页的楼中楼。随便点击窗口之外其他的位置，即可关闭悬浮窗口

    优点：完全基于本地实现，没有任何网络请求，速度尚可。缺点：楼中楼功能仅限于当前页，隔页的回复无法实现..
    还有 需要手动点一下

    楼中楼里会有哪些评论：

    假如一条评论 a@b ，在点击按钮后，会把本条评论之前的 b 的全部发言收集起来；本条评论之后（包括本条评论）的 a@b ，或者是 b@a 这样的评论收集起来

    脚本的悬浮窗，直接用的第三方的油猴的库实现的，逻辑会写，界面目前写不好，欢迎改写哈哈。注释很多，欢迎审查~

    脚本下载链接： https://greasyfork.org/en/scripts/466852 image

    Supplement 1  ·  May 23, 2023
    0.1.2 新增功能①悬浮☸按钮自动打开楼中楼页面。此选项默认关闭，有需要可以在脚本设置项手动开启②打开楼中楼页面后，可以按 Esc 键关闭楼中楼页面。
    0.1.4 进一步完善脚本功能，在一个 id 同时 @多个 id 的情况下，会把 @的多个人都识别到。
    比如 a 同时 @b 、 @c 、 @d ， 会将 a 和 b ，c ，d 的楼中楼内容全部叠加在一起，实现同时展示。
    0.1.6 新增适配黑暗模式~
    Supplement 2  ·  May 25, 2023
    0.2.0 版本发布，抛弃第三方库，重写 ui ，新增多种交互。
    (1)鼠标悬浮于☸按钮，自动打开楼中楼 ，已是默认功能，不再需要点击。点击楼中楼界面的楼层按钮，可以快速跳转到对应楼层。黑暗模式下适配滚动条颜色。
    (2)关闭楼中楼有三种实现逻辑： ①鼠标移入楼中楼 然后移出，楼中楼自动关闭 ②鼠标移出主评论区域 楼中楼自动关闭 ③按 Esc 键 任意时刻快速关闭楼中楼
    (3)新增右侧楼中楼选项，默认关闭，可手动开启。会在评论区右侧空白处，完美填充楼中楼(楼中楼页面弹出后 无需再关闭，可同时显示更多信息)。完美适配各种缩放(如临时缩放需要刷新页面生效)。
  • 脚本
  • 评论
  • 悬浮
  • 楼
    34 replies  •  2023-05-25 20:27:08 +08:00
    Tlvncks
        1
    Tlvncks  
       May 22, 2023   ❤️ 1
    直接鼠标指向被 @账号后自动弹出悬浮窗显示对话，这样更方便
    Hliushi
        2
    Hliushi  
       May 22, 2023   ❤️ 1
    谢谢 op 开发的插件，
    说一下现在的体验:
    1 、这个弹窗的动画有点僵硬
    2 、弹窗是否可以支持用 ESC 快捷键关闭呢
    3 、还有就是进行「网页百分比缩放」、「调试打开」那个 ☸ 图标没有固定到最右边
    4 、刚刚使用中遇到有一个 bug ，有个元素大概率没有抓取到
    源码错误位置 70: let atMember=replyList[i].querySelector(".reply_content a").textContent
    properties of null (reading 'textContent')
    at unsafeWindow.genReplyBox (userscript.html?name=v2ex%25E6%25A5%25BC%25E4%25B8%25AD%25E6%25A5%25BC.user.js&id=d5705021-719d-420c-961c-efae58b59743:380:76)
    at HTMLButtonElement.onclick (VM1297 941894:1:1)
    unsafeWindow.genReplyBox @ user
    Exgirlfriends
        3
    Exgirlfriends  
       May 22, 2023   ❤️ 1
    谢谢。这个好。
    Xianmua
        4
    Xianmua  
    OP
       May 22, 2023
    @Hliushi 我刚更新了下，你看下还有问题吗🤣刚发出去就发现严重问题了，赶紧修了修
    Xianmua
        5
    Xianmua  
    OP
       May 22, 2023
    要是发现问题了，麻烦贴一下生成楼中楼出现问题的 评论的链接，多谢各位~
    Xianmua
        6
    Xianmua  
    OP
       May 22, 2023   ❤️ 1
    那个百分比缩放后的问题刚看了，确实有点离谱，在研究...
    Hliushi
        7
    Hliushi  
       May 22, 2023
    @Xianmua 刚刚说的第四个问题 bug 解决了
    但是我有发现一个样式问题，当点击帖子 op 自己，左下角出现了蓝色的长方形样式
    具体帖子: https://www.v2ex.com/t/942019 #15 楼
    ![image-20230522223113504]( https://hliushi-img.oss-cn-shanghai.aliyuncs.com/img/image-20230522223113504.png)
    Hliushi
        8
    Hliushi  
       May 22, 2023
    @Xianmua 可能是用了上一个版本 0.1 复现的，目前在使用 0.1.1 突然没有啦
    Xianmua
        9
    Xianmua  
    OP
       May 22, 2023
    @Hliushi 哈哈那个问题就是我刚修的，css 那里改动了..百分比缩放那个跟 css 有关系，css 不太熟...一会准备用个简单粗暴的方式解决掉...
    Xianmua
        10
    Xianmua  
    OP
       May 22, 2023
    @Tlvncks
    @Hliushi 0.1.2 已修复网页缩放 bug 。新增功能①悬浮☸按钮自动打开楼中楼页面。此选项默认关闭，有需要可以在脚本设置项手动开启。在触发楼中楼后，建议略微挪动下鼠标，不然关闭楼中楼后 容易再次触发②打开楼中楼页面后，可以按 Esc 键关闭楼中楼页面。
    Xianmua
        11
    Xianmua  
    OP
       May 23, 2023
    补充一下，上面说的“在触发楼中楼后，建议略微挪动下鼠标，不然关闭楼中楼后 容易再次触发”，意思是“在悬停触发楼中楼后，如果使用 Esc 关闭楼中楼，建议略微挪动下鼠标，不然容易再次触发”
    还有 发现这当例子的动图，内容不大和谐哈哈，不过改不了了 就这样吧

    0.1.4 版本已发，进一步完善脚本功能，在一个 id 同时 @多个 id 的情况下，会把 @的多个人都识别到。
    比如 a 同时 @b 、 @c 、 @d ， 会将 a 和 b ，c ，d 的楼中楼内容全部叠加在一起，实现同时展示。现在应该比较完美了。
    Xianmua
        12
    Xianmua  
    OP
       May 23, 2023
    补个视频
    sanshao124
        13
    sanshao124  
       May 23, 2023
    楼主能做一个支持手机的版本吗？
    wuvvu
        14
    wuvvu  
       May 23, 2023
    提一个建议，增加深色主题检测。
    用深色主题，鼠标一悬浮就显示一片白色，有点刺眼
    lisxour
        15
    lisxour  
       May 23, 2023
    想要完美解决楼中楼问题，还得 v 站自己去解决，包括提到的跨页回复，v 站不出手，谈何完美。
    Xianmua
        16
    Xianmua  
    OP
       May 23, 2023
    楼主要卒...🤣，赶紧补充一下，昨天说的“比较完美”的意思是，没有明显 bug...
    回复一下， ①支持手机，这个难度很大😂 可能需要浏览器支持安装油猴插件，那个悬浮窗用的第三方的库，没适配的可能性很大，而且我也没有能装插件的浏览器，没法调试...②适配深色模式，这个确实很有必要，我试着改一下 css
    Xianmua
        17
    Xianmua  
    OP
       May 23, 2023
    @wuvvu 0.1.6 版本已发布，已适配黑暗模式~
    wuvvu
        18
    wuvvu  
       May 23, 2023   ❤️ 1
    @Xianmua #17
    真不错，看起来舒服多了
    fighter2011
        19
    fighter2011  
       May 23, 2023   ❤️ 1
    不错，点赞
    catsoul
        20
    catsoul  
       May 23, 2023   ❤️ 1
    win11 设置显示为 150%，会错位
    Xianmua
        21
    Xianmua  
    OP
       May 23, 2023
    @catsoul 刚发布了 0.1.7 ，临时应付了下页面缩放的问题..
    HongyuGao
        22
    HongyuGao  
       May 23, 2023   ❤️ 1
    挺好，notion 那来的😄
    emonc
        23
    emonc  
       May 23, 2023
    用别人的咳嗽
    Xianmua
        24
    Xianmua  
    OP
       May 23, 2023   ❤️ 1
    @emonc 这个看起来更像楼中楼，我这个像个半成品🤣
    xiyuesaves
        25
    xiyuesaves  
       May 24, 2023


    分享下我写的，鼠标移动到用户名上就能浮出这个用户的上一条留言，动画用 css 来做会丝滑很多
    Xianmua
        26
    Xianmua  
    OP
       May 24, 2023
    @xiyuesaves 所以分享的链接在哪..😂
    Xianmua
        28
    Xianmua  
    OP
       May 24, 2023
    @xiyuesaves #25 不错不错，我找到了，效果不错，大家喜欢的也可以装，xiyuesaves 的脚本链接是这个： https://greasyfork.org/en/scripts/435985
    Xianmua
        29
    Xianmua  
    OP
       May 24, 2023
    @xiyuesaves 绝了，你那脚本跟我这好像有冲突哈哈🤣俩脚本同时开启的话，我那个会显示重复内容
    xiyuesaves
        30
    xiyuesaves  
       May 24, 2023
    @Xianmua #29 应该是我的修改了 dom 结构的原因
    traffic
        31
    traffic  
       May 24, 2023
    大佬有没有可能给 flarum 论坛写一个，这个论坛程序使用率越来越高。
    但是目前无论是服务端还是客户端的楼中楼插件我都没有发现。
    Xianmua
        32
    Xianmua  
    OP
       May 24, 2023
    @traffic 不是大佬哈哈，我刚搜了下 flarum ，好像自带引用评论的功能，比如这个页面： https://discuss.flarum.org.cn/d/2922/4 ，鼠标放在悬浮的箭头那里，就会显示内容，点击也会快速滚动到 回复的评论那个位置
    ttentau1
        33
    ttentau1  
       May 24, 2023

    可以试试这个，支持跨页
    https://greasyfork.org/zh-CN/scripts/458024
    Greatshu
        34
    Greatshu  
       May 25, 2023   ❤️ 1
    非本人开发，这个是 V2EX 最好用的回复缩进油猴脚本，没有之一，配合 V2EX plus 的楼主高亮功能效果更佳。如果一个帖子超过 100 个回复，存在分页，它还能把所有回复合成一页。
    https://greasyfork.org/zh-CN/scripts/14182-v2excellent-js
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   1040 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 58ms · UTC 18:12 · PVG 02:12 · LAX 11:12 · JFK 14:12
    ♥ Do have faith in what you're doing.