Winbox项目：如何禁用窗口标题栏双击全屏功能

Winbox是一个优秀的轻量级JavaScript窗口管理器，提供了丰富的窗口控制功能。在实际开发中，有时我们需要禁用窗口标题栏的双击全屏功能，本文将详细介绍如何实现这一需求。

问题背景

在Winbox项目中，默认情况下双击窗口标题栏会触发窗口全屏显示。即使我们移除了全屏控制按钮(.removeControl("wb-full"))，这个双击行为仍然有效。这可能会与某些特定的UI交互需求产生冲突。

解决方案

Winbox提供了两种方式来解决这个问题：

1. 通过CSS类禁用

在创建窗口时，可以通过添加no-full类来禁用双击全屏功能：

new Winbox({
    title: "我的窗口",
    class: ["no-full"]
});

这个类名直观地表达了它的功能——禁用全屏操作。如果需要同时禁用最大化功能，可以添加no-max类：

new Winbox({
    title: "我的窗口",
    class: ["no-full", "no-max"]
});

2. 通过事件阻止

虽然提问者尝试使用e.preventDefault()和e.stopPropagation()没有成功，但实际上Winbox内部确实是通过事件监听来实现这一功能的。更深入的做法是重写相关的事件处理器：

const winbox = new Winbox({
    title: "我的窗口"
});

// 获取标题栏元素
const header = winbox.dom.querySelector(".wb-header");

// 移除默认的双击事件监听
header.ondblclick = null;

// 或者添加自己的双击处理逻辑
header.addEventListener("dblclick", (e) => {
    e.preventDefault();
    e.stopPropagation();
    // 自定义的双击行为
});

实现原理

Winbox内部通过CSS类和事件监听两种机制来控制窗口行为：

1. CSS类机制：当添加no-full类时，Winbox会在初始化时跳过相关事件监听器的注册
2. 事件机制：默认情况下，Winbox会在标题栏元素上注册双击事件监听器

最佳实践

根据不同的使用场景，推荐以下做法：

1. 简单禁用：使用class: ["no-full"]是最简单直接的方式
2. 自定义行为：如果需要完全自定义双击行为，建议先移除默认监听器再添加自己的逻辑
3. 全局配置：如果需要在整个应用中统一禁用此功能，可以考虑扩展Winbox原型或创建包装函数

总结

Winbox提供了灵活的方式来控制窗口的各种行为，包括标题栏的双击全屏功能。通过理解其内部机制，开发者可以轻松实现各种定制化需求。记住，最简单的解决方案往往就是添加适当的CSS类，这也是WinboxAPI设计的一大优点——直观且易于使用。