ayah ayah - 5 months ago 9
HTML Question

hide element press Esc

This code doesn't hide the box

div
which was supposed to be hidden when I press the Esc key.

function Boxup(elementN, event){
$("#"+elementN).css({
"display":"block",
"top":event.pageY+"px" ,
"left":event.pageX+"px"
})
}
function hideCurrentPopup(ele){
$(ele).parent().hide();
}

$(this).keyup(function(event) {
if (event.which == 27) {
disablePopup();
}
});


Am I missing something?

Answer

From your code I cannot exactly tell what's this referring to in this line:

$(this).keyup(function(event) {

cause it this refers to a "textarea" or "input" it will trigger the event if that element has focus, otherwise you're looking for keyup events registered by document

but here's what you can try.

function Boxup(elementN, event){
    $("#"+elementN).css({
        display : "block",
        top  : event.pageY , // px are not needed as they are default unit in jQ
        left : event.pageX    
    })
}

function hideCurrentPopup(ele){ // note your function name and the argument! 
    $(ele).parent().hide();     // (do you need .parent()? I don't know
}                               // without seeing any HTML sample)

$(document).keyup(function(event) { // document is probably the selector you want
    if (event.which == 27) { 
        hideCurrentPopup("#hereYourPopupID");  // try alike
    }   
});

P.S: Make sure that by using $(some Selector here).keyup(function(event) { you're not preventing in any case a keyup event to bubble up the DOM tree to reach the documentElement