Ik heb een javascript window.open pop-up, en ik wil dat de pop-up zichzelf sluit wanneer de gebruiker op de ESC-toets drukt. Ik kan er niet achter komen hoe ik de keydown-gebeurtenis moet vasthaken (en op welk object?) zodat ik de ESC-sleutel kan vangen.

Ik gebruik jQuery.

Antwoord 1, autoriteit 100%

Probeer zoiets als dit:

$(document).keydown(function(e) {
    // ESCAPE key pressed
    if (e.keyCode == 27) {
        window.close();
    }
});

Antwoord 2, autoriteit 56%

Het is mogelijk om te bereiken met JS zonder jQuery te gebruiken.

window.onkeydown = function( event ) {
    if ( event.keyCode == 27 ) {
        console.log( 'escape pressed' );
    }
};

Antwoord 3, autoriteit 16%

event.key === “Escape”

Geen willekeurige cijfercodes meer!

document.addEventListener('keydown', function(event) {
    const key = event.key; // const {key} = event; in ES6+
    if (key === "Escape") {
        window.close();
    }
});

Mozilla Docs

Ondersteunde browsers

Antwoord 4, autoriteit 3%

Vergeet niet dat u de functie moet gebruiken @Gumbo heeft gepostin het pop-upvenster… Je moet dus JQuery in de pop-up opnemen en de functie daar uitvoeren, niet het venster dat de pop-up opent.

Antwoord 5

Om zowel esc als enter-toets in dialoog te verwerken
window.onkeydown = functie(gebeurtenis) {

if(event.keyCode===27|| event.keyCode===13){
   window.close();
}
}

Antwoord 6

Je kunt gemakkelijk sleutelgebeurtenissenbereiken met Jquery.

Hier kunt u .keydown()

gebruiken

Lijst met codes voor toetsenbordtoetsen

 $(document).keydown(function(e) {        
    if (e.keyCode == 27) {
        window.close();
    }
});

Antwoord 7

@Gumbo’s antwoord is goed, maar vaak moet je dit gedrag loskoppelen, dus ik raad aan om de gebeurtenis-handler onete gebruiken:

$(document).one('keydown', function(e) {
    // ESCAPE key pressed
    if (e.keyCode == 27) {
        window.close();
    }
});

OF

$(document).on('keydown', function(e) {
    // ESCAPE key pressed
    if (e.keyCode == 27) {
        window.close();
    }
});

en wanneer klaar om het gedrag te stoppen

$(document).off('keydown');

Antwoord 8

Als u op zoek bent naar een pop-upoplossing voor angularjs, hier gaat u dan

*dit is zonder gebruik te maken van ui-bootstrap-afhankelijkheid (alleen aanbevolen als het niet anders kan)

$scope.openModal = function(index){
    $scope.showpopup = true;
    event.stopPropagation();//cool part
};
$scope.closeModal = function(){
    $scope.cc.modal.showpopup = false;
};
window.onclick = function() {
  if ($scope.showpopup) {
      $scope.showpopup = false;
      // You should let angular know about the update that you have made, so that it can refresh the UI
      $scope.$apply();
  }
};
//escape key functionality playing with scope variable
document.onkeydown = function (event) {
  const key = event.key; // const {key} = event; in ES6+
  if (key === "Escape") {
    if ($scope.showpopup) {
        $scope.showpopup = false;
        // You should let angular know about the update that you have made, so that it can refresh the UI
        $scope.$apply();
    }
  }
};

Referenties: bovenstaande antwoorden en http:/ /blog.nkn.io/post/hiding-menu-when-clicking-outside—angularjs/