Rectangle {
	id: rect
	
	width: 100
	height: 100
	color: mouseArea.containsMouse ? "red" : "green"
	
	MouseArea {
		id: mouseArea
		anchors.fill: rect
		hoverEnabled: true
		onClicked: popup1.open()
	}
}

Popup {
	id: popup1
	width: 200
	height: 300
	modal: true
	focus: true
	anchors.centerIn: parent
	closePolicy: Popup.CloseOnEscape
	contentItem : Rectangle {
	}
}

The color of id "rect" auto change to "red" when popup1 opened. (the popup auto "catch" hovered behavior on mousearea)

But if i have 2 popup like the first post, when popup2 opened (by click on btn1 on popup1) , btn1 will keep hovered behavior (not "catch" by popup2)

i want that when popup2 open, btn1 is not hovered and change it background to green.

What have you tried and what is blocking you?
You currently have a binding to determine the background color of btn1. Have you tried changing that binding to account for your additional condition?

You are right, I want to disable hover behavior on btn1( on popup1) when popup2 visible.
( I need to change background of btn1 to green when popup2 opened)

But it seen that the code you show don't help me. I have implemented like your code but btn1 also "red" when popup2 opened

import QtQuick
import QtQuick.Controls
Window {
    width: 640
    height: 480
    visible: true

    Component.onCompleted: {
        loader.item.open()
    }

    Loader {
        id: loader
        sourceComponent: popupComponent
    }
    Popup {
        id: popup1
        width: 100
        height: 100
        x: 100
        y: 100
        padding: 0
        modal: true
        focus: true
        contentItem: Rectangle {
            id: popup1Container
            Button {
                id: btn1
                anchors.fill: parent
                background: Rectangle {
                    color: btn1.hovered ? "red" : "green"
                }
                onClicked: popup2.open()
            }
        }
    }

    Popup {
        id: popup2
        width: 100
        height: 100
        padding: 0
        closePolicy: Popup.NoAutoClose
        x: popup1.x + popup1.width
        y: popup1.y + popup1.height
        modal: true
        focus: true
        contentItem: Rectangle {
            id: popup2Container
            height: 100
            width: 100
            Button {
                id: btn2
                anchors.fill: parent
                background: Rectangle {
                    color: "yellow"
                }
                onClicked: popup2.close()
                Text {
                    text: "Close"
                    anchors.centerIn: parent
                }
            }
        }
    }
    Component {
        id: popupComponent
        Popup {
            width: 100
            height: 100
            modal: true
            focus: true
            background: Rectangle {
                id: popupContainer
                color: "blue"
                TapHandler {
                    onTapped: popup1.open()
                }
            }
        }
    }
}