Показать div после щелчка и скрыть при нажатии на него

Question

Этот вопрос задан несколько раз, однако ни один из ответов не работает для меня. Я хочу ДИВ быть дисплей, когда нажмите на ссылку Затем нажмите вне его, отд Скрыть

my code

HTML:

<a href="#" id='link'>Click here to show div</a> 

ЯШ:

$('#link').click(function(e) { 
    $('div.termifier').remove(); 
    $('<div>').addClass('termifier').css({ 
     position: 'absolute', 
     top: event.pageY , 
     left: event.pageX , 
     display: 'none' 
     }).appendTo('body') 
    .append(
     $('<div>').html("termifier") 
    ); 
    $('div.termifier').fadeIn('slow'); 
}); 

$('html').click(function() { 
    $('div.termifier').fadeOut(); 
}); 

$('div.termifier').click(function(e){ 
    e.stopPropagation(); 
}); 

CSS

div.termifier { 
    background-color: cornsilk; 
    width: 256px; 
    color: brown; 
    padding: 8px; 
    font-size: 0.8em; 
} 

Answer 1

Использование e.stopPropagation()

$('#link').click(function(e) { 
    e.stopPropagation(); 
    /* Rest of the code for clicking */ 
}); 

DEMO

Если вы хотите, чтобы предотвратить замирание при нажатии Див Aswell, сделайте следующее:

$(document.body).bind('click','.termifier',function(e){ 
    e.stopPropagation(); 
}); 

Вы можете использовать .on() вместо .bind() если вы должны были использовать более новую версию jQuery, чем 1.6.4

DEMO