JavaScript Всплывающие окна не закрываются

Question

Я делаю страницу с карьерой для веб-сайта, вакансии попадают на страницу, и когда вы нажимаете на нее, появляется описание работы, я хочу, чтобы она закрылась, когда вы нажимаете в другом месте i получил первый пункт, чтобы сделать это, но остальное не будет.

<div class="joblisting"> 

    <a href="#" class="contact" id="job_id"> 
     <div class="messagepop pop" id="menucontainer"> 
      job_description 
     </div> 
     <p>click to read description...</p> 
    </a> 

</div> 

http://jsfiddle.net/ZZ2BS/2/: здесь на jsFiddle.

Answer 1

У вас есть два элемента с одинаковым идентификатором. Вместо этого используйте класс.

$(document).click(function(event) { 

    if($('.messagepop').is(":visible")) { 
     $('.messagepop').hide() 
    } 
}); 

http://jsfiddle.net/philwills/ZZ2BS/4/

Answer 2

Скрыть всплывающий элемент по щелчку в любом месте и использовать stopPropagation(), чтобы исключить элемент сами.

var popup = documrnt.getElementById("popup_id"); 

document.addEventListener("click", function(){ 
    popup.style.display = "none" 
}, false); 

popup.addEventListener("click", function(e){ 
    e.stopPropagation(); 
});