How to redirect to a new page only when the last modal is closed-CodePudding

I have a series of modals that are triggered based on the div class.

In the example below the modals are triggered when 2 div have a specific class. So when 2 cards match.

I would like to add a page redirect after ALL the divs have class .matched but only when the last modal is closed

JSFiddle

CodePudding user response：

You can check whether all the divs contain the class with every close button click and reload/redirect once they do.

const closeButton = document.querySelector('.clsBtn')
const cards = document.querySelectorAll('.flip')
closeButton.addEventListener('click', () => {
    let matched = true
    cards.forEach(card => {
        if (!card.classList.contains('matched')) {
            matched = false
        }
    })
    if (matched === true) {
        location.reload();
    }
})

Need to add a class to the close button.

 <button type="button"  data-bs-dismiss="modal">Close</button>