Запуск функции по клику
Коллеги, не могу понять по какому принципу нужно добавлять event listners к элементам. Есть простой код HTML:
<html> <body id="all"> <div id="popcorn"><p>popcorn </p></div> <a href="#" id="disclamer" onclick="mayday()">Disclamer</p></a> </body> </html> При нажатии на Disclamer запускается функция mayday(). Функция затемняет body, показывает как бы новое окно, добавляет к body event listner по клику мышки, и при нажатии мышки происходит удаление этого окна с использованием функции norma(). Проблема в том, что при нажатии на Dislamer запускается и mayday(), и сразу же запускается norama(). Как их развести, чтобы norma() запускалась не по тому же клику, а по следующему? Код JS следующий: function mayday(){ xx=document.getElementById("all"); xx.style.background="#999999"; xx.style.zIndex="1"; // xx.style.opacity="0.5"; texttext="There have been the greatest changes in the life surroundings and conditions of human being during the present century!"; var win=document.createElement('div'); win.innerHTML=texttext; win.id="win"; win.style.border="solid black 1px"; win.style.background="white"; win.style.color="black"; win.style.zIndex="1000"; win.style.opacity="1.0"; win.style.position="absolute"; win.style.top="25%"; win.style.left="25%"; win.style.width="25%"; win.style.height="25%"; parentElem=document.body; parentElem.appendChild(win); document.getElementById("all").addEventListener("click",norma); }; function norma(){ //alert("here"); xx=document.getElementById("all"); xx.style.background="#ffffff"; xx.style.zIndex="100"; parentElem=document.body; zz=document.getElementById("win"); parentElem.removeChild(zz); }; |
Аааааааааааааааааааааа...е
нужно добавлять следующий event listner на mousedown!!!! Ура!!!:victory:
|
vmetnev@mail.ru,
Все дело во всплытии! https://jsfiddle.net/2mdv5rkp/ строка № 3 . почитай на эту тему https://learn.javascript.ru/event-bubbling да и перепишите свой код... |
Часовой пояс GMT +3, время: 09:08. |