0

В общем я сделал такую toggle функцию, где при нажатии на кнопку обект исчезает и появляется, однако мне еще нужно чтобы он исчезал когда нажму на любое место кроме него самого(включая все его child элементы).

function displayOnClick(clickingObjId, displayObj) {
    let status = 1;
    document.getElementById(clickingObjId).onclick = function() {
        if(status == 1){
            document.getElementById(displayObj).style.display = 'block';
            status = 0;
        } else if (status == 0){
            document.getElementById(displayObj).style.display = 'none';
            status = 1;
        }

        return status 

    };
    document.onclick = function (e) {
        if (status !== 1 && e.target !== displayObj){ 
            document.getElementById(displayObj).style.display = 'none';
            status = 1;
        }
    }
}; 

Я пытался сделать это раньше через onclick, e.target !== данному обьекту. Но тогда, либо нажимая на элементы внутри самого обекта он все равно закрывался, либо переставала работать кнопка которая должна открывать его, потому что она находиться за перделами элемента который нужно закрыть => срабатывала команда на его закрытие. В общем нужно чтобы были такие условия:
1) чтобы функция работала только когда status == 0;
2) чтобы закрывало элемент при нажатии на любое место кроме него самого(включая все child элементы)
Помогите пожалуйста

1 ответ 1

1

document.body.addEventListener('click', e=>{
div.style.display = 'none';

})

div.addEventListener('click', e=>{
e.stopImmediatePropagation();
})
div {
  width: 200px;
  height: 200px;
  background-color: red;
  color: white;
}
<div id="div">Div</div>

4
  • Хм вроде скопировал все также, только поменял дивы на свой id, однако выдает ошибку(displayObj.addEventListener is not a function) document.body.addEventListener('click', e=>{ displayObj.style.display = 'none'; }); displayObj.addEventListener('click', e=>{ e.stopImmediatePropagation(); });
    – Condomer
    19 мар 2020 в 11:10
  • displayObj -- это что? class или id?
    – Air
    19 мар 2020 в 13:18
  • displayObj это id
    – Condomer
    21 мар 2020 в 15:11
  • правь вопрос... добавь что наработал
    – Air
    21 мар 2020 в 15:23

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.