jquery - .show()/.hide() on click -

jquery - .show()/.hide() on click -

i have jquery function:

function jquerypopup(value) { $(value).show(); $('#jqueryclose').click(function(){ $(value).hide(); }); $( document ).on( 'click', function ( e ) { if ( $( e.target ).closest( elem ).length === 0 ) { $(value).hide(); } }); $( document ).on( 'keydown', function ( e ) { if ( e.keycode === 27 ) { // esc $(value).hide(); } }); }

when phone call function shows div (value)

how can utilize button/link used open close too?

you can utilize toggle() function show/hide purpose.

but you're binding event handlers within function… note whenever function jquerypopup called (unless it's binded ready event , called once), it'll add together new handler, code won't work expected afterwards since more 1 handlers fire upon event.

change code follows (assuming want bind events upon page load):

$(document).ready(function(){ $('#jqueryclose').click(function(){ $(value).hide(); }); $( document ).on( 'click', function ( e ) { if ( $( e.target ).closest( elem ).length === 0 ) { $(value).hide(); } }); $( document ).on( 'keydown', function ( e ) { if ( e.keycode === 27 ) { // esc $(value).hide(); } }); }) function jquerypopup(value) { $(value).toggle(); }

side note: seems using different methods same purpose such click, on('click',function(){...}) etc, it's practice consistant , stick particular method

jquery html