Закрытие всплывающего окна, при нажатии в любой области экрана

@Sannikov1994 · Регистрация: 22.09.2014

Студворк — интернет-сервис помощи студентам

Добрый день. У меня есть два блока, при нажатии на которые появляется скрытый текст, но нужно чтобы он скрывался если будет произведен клик в другой области экрана.

HTML5
1
2
3
4
5
6
7
8
9
        <p><a onclick="look('hidden_content_price'); return false;" href="#">прайс</a></p>
        <div id="hidden_content_price" style="display: none;">
            <p><a href="">скачать прайс на продукцию</a></p>
        </div>
 
        <p><a onclick="look('hidden_content_question'); return false;" href="#">задать вопрос</a></p>
        <div id="hidden_content_question" style="display: none;">
            <p>Если вы не нашли интересующих вас материалов, обратитесь к специалистам нашей компании по контактным телефонам или заполните форму <a href="">обратной связи</a>.</p>
        </div>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
var show;
function look(type) {
    param=document.getElementById(type);
    if(param.style.display == "none"){
        if(show) show.style.display = "none";
        param.style.display = "block";
        show = param;
    } else{
        param.style.display = "none";
    }
}

@Evgeny Sh. · 05.07.2016, 12:07

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
    document.body.addEventListener("click", showBlock);
    var elem1 = document.getElementById('hidden_content_price');
    var elem2 = document.getElementById('hidden_content_question');
 
    function showBlock (event) {
        event.preventDefault();
        var id = event.target.id;
        if (id === 'hidden_content_price' || id === 'hidden_content_question') {
            event.target.style.display = 'block';
        } else {
            elem1.style.display = 'none';
            elem2.style.display = 'none';
        }
        
    }

Добавлено через 5 минут
Немного не то, в общем тебе надо повесить обработчик события на body и проверять на что нажали

@newJS · 06.07.2016, 06:36

вот ещё вариант
Обмен готовыми решениями

Новые блоги и статьи Все статьи Все блоги /
Уведомление о неверно выбранном значении справочника Maks 06.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .	Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt 8Observer8 05.04.2026 Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .	AkelPad-скрипты, структуры, и немного лирики.. testuser2 05.04.2026 Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .	Отображение реквизитов в документе по условию и контроль их заполнения Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .
Фото всей Земли с борта корабля Orion миссии Artemis II kumehtar 04.04.2026 Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .	Вывод диалогового окна перед закрытием, если документ не проведён Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .	Программный контроль заполнения реквизитов табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .	wmic не является внутренней или внешней командой Maks 02.04.2026 Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/

@newJS 2436 / 1115 / 312 Регистрация: 23.06.2011 Сообщений: 3,531
	06.07.2016, 06:36
	вот ещё вариант Обмен готовыми решениями 0