javascript - jQuery disable a div, when click anywhere on page -

javascript - jQuery disable a div, when click anywhere on page -

here comment form's textarea hidden inputs.

$('#c_text').click(function() { if ($('#hidden_part').attr('class') == 'closed') { $('#hidden_part').css('display','block'); $('#hidden_part').removeclass('closed'); } else { $('#hidden_part').css('display','none'); $('#hidden_part').addclass('closed'); }; });

when click, textarea hidden input apper well, but, how can hide part name called #hidden_part anywhere else on page ?

you have hide div content when clicking on document , utilize event.stoppropagation(); method when clicking on textarea div content displayed,

here example...

html code

<textarea></textarea> <div id="hidden_part"> <a href="google.com">google</a> <p>lorem ipsum dolor sit down amet, consectetur adipiscing elit. suspendisse congue ipsum quam, nec blandit sapien eleifend eget. cras cursus ullamcorper risus nec rutrum. praesent lobortis nibh turpis. curabitur eleifend leo ultricies efficitur dignissim. aliquam eget dapibus nisi. fusce dictum laoreet enim, nec blandit arcu feugiat sagittis. mauris non dolor nec dui luctus ornare. vestibulum pulvinar metus diam, european union vulputate leo suscipit ut. donec eget consequat sem, et finibus lorem.</p> </div>

jquery code

$(document).click(function(){ $("#hidden_part").hide(); }); $('textarea').click(function(event){ $("#hidden_part").show(); event.stoppropagation(); });

http://jsfiddle.net/dc3lngw3/

javascript jquery html hidden-field