How to close window left button of mouse?

Question

I have some popups and now they close if i press any mouse button. I need only left mouse to press and close popup

And the 2nd one question. Why esc popup code doesnt work??

    const overlayClose = (evt) => {
        if (evt.target.classList.contains('popup_active')) {
            togglePopup(evt.target);
        }
    }
    editPopup.addEventListener('mousedown', (evt) => {
        overlayClose(evt);
    });
    addPopup.addEventListener('mousedown', (evt) => {
        overlayClose(evt);
    });
    imagePopup.addEventListener('mousedown', (evt) => {
        overlayClose(evt);
    });
    
    
    //popup esc code
function togglePopup(popup) {
    popup.classList.toggle('popup_active');
    if (popup.classList.contains('popup_active')) {
        document.addEventListener('keydown', closeEscape);
    } else {
        document.removeEventListener('keydown', closeEscape);
    }
}


const closeEscape = (evt) => {
    if (evt.key === "Escape") {
        popup.classList.remove('popup_active');
    }
}

@Ivar Yes. But i still dont understand how can i use that in my code — Иван иванов, Aug 09 '20 at 00:22
@Иваниванов Put the code from that function (without the return line) at the top of your event listeners and put the `button == 1` inside an if-statement condition. Everything in the if-statement will only be executed if you left-click. — Ivar, Aug 09 '20 at 00:26

Temoncher · Answer 1 · 2020-08-09T00:33:04.277

0

Here's useful docs about mouse click events https://www.w3schools.com/jsref/event_button.asp

You can add event listener on 'mousedown' event and check if event.button equals 0.

UPD

You simply need to add if condition in your event handlers

 editPopup.addEventListener('mousedown', (evt) => {
    if (evt.button === 0) {
      overlayClose(evt);
    }
 });

edited Aug 09 '20 at 00:33

answered Aug 09 '20 at 00:14

Temoncher

644
5
15

How to close window left button of mouse?

1 Answers1

UPD