如何实现重叠按钮？点击交集区域时触发两个按钮响应

针对你提出的「两个重叠按钮，点击交集区域时同时激活」的需求，结合你提到修改mouse_filter无效的情况，给你几个可行的实现思路：

1. 事件转发（以Qt为例，对应你提到的mouse_filter场景） #

mouse_filter的作用是过滤事件、阻止事件向下传递，这和你需要让两个按钮都响应的需求相悖。你可以通过重写上层按钮的鼠标点击事件，在处理自身逻辑后主动触发下层按钮的点击：

// 自定义上层按钮类，重写mousePressEvent
void UpperButton::mousePressEvent(QMouseEvent *event)
{
    // 先执行自身的点击逻辑
    QPushButton::mousePressEvent(event);
    // 手动触发下层按钮的点击
    lowerButton->click();
}

如果需要完整传递鼠标事件（比如区分左键/右键、点击位置），也可以用事件转发的方式：

void UpperButton::mousePressEvent(QMouseEvent *event)
{
    QPushButton::mousePressEvent(event);
    // 转换坐标为下层按钮的局部坐标
    QPoint targetPos = lowerButton->mapFromGlobal(event->globalPos());
    // 创建新的鼠标事件并发送给下层按钮
    QMouseEvent* forwardEvent = new QMouseEvent(
        event->type(), 
        targetPos, 
        event->button(), 
        event->buttons(), 
        event->modifiers()
    );
    QApplication::postEvent(lowerButton, forwardEvent);
}

2. 全局事件过滤器（通用场景适配） #

在父窗口或全局层面安装事件过滤器，检测鼠标点击位置是否同时落在两个按钮的区域内，若是则主动触发两个按钮的点击：

bool MainWindow::eventFilter(QObject *obj, QEvent *event)
{
    if (event->type() == QEvent::MouseButtonPress)
    {
        QMouseEvent* mouseEvent = static_cast<QMouseEvent*>(event);
        // 转换点击坐标为两个按钮的局部坐标，判断是否在按钮区域内
        bool inBtn1 = ui->btn1->geometry().contains(ui->btn1->mapFromGlobal(mouseEvent->globalPos()));
        bool inBtn2 = ui->btn2->geometry().contains(ui->btn2->mapFromGlobal(mouseEvent->globalPos()));
        
        if (inBtn1 && inBtn2)
        {
            ui->btn1->click();
            ui->btn2->click();
            return true; // 阻止默认处理，避免重复触发
        }
    }
    return QMainWindow::eventFilter(obj, event);
}

使用时记得给两个按钮安装过滤器：

ui->btn1->installEventFilter(this);
ui->btn2->installEventFilter(this);

3. 网页端（JavaScript）实现思路 #

如果是网页场景，你可以监听父容器的点击事件，判断点击坐标是否同时在两个按钮的范围内：

const container = document.getElementById('btn-container');
container.addEventListener('click', (e) => {
    const btn1 = document.getElementById('btn1');
    const btn2 = document.getElementById('btn2');
    
    // 获取两个按钮的位置信息
    const rect1 = btn1.getBoundingClientRect();
    const rect2 = btn2.getBoundingClientRect();
    
    // 判断点击位置是否同时在两个按钮内
    const inBtn1 = e.clientX >= rect1.left && e.clientX <= rect1.right && 
                   e.clientY >= rect1.top && e.clientY <= rect1.bottom;
    const inBtn2 = e.clientX >= rect2.left && e.clientX <= rect2.right && 
                   e.clientY >= rect2.top && e.clientY <= rect2.bottom;
    
    if (inBtn1 && inBtn2) {
        btn1.click();
        btn2.click();
    }
});

内容的提问来源于stack exchange，提问作者Max Kalentsov