शुद्ध जेएस या jQuery के साथ एस्केप कुंजी प्रेस का पता कैसे लगाएं?

Question

संभावित डुप्लिकेट:
jQuery के साथ भागने की कुंजी के लिए कौन सा कीकोड

कैसे आईई, फ़ायरफ़ॉक्स और क्रोम में भागने कुंजी दबाएँ पता लगाने के लिए? नीचे कोड IE और अलर्ट में काम करता है 27, लेकिन फ़ायरफ़ॉक्स में यह अलर्ट करता है0

$('body').keypress(function(e){
    alert(e.which);
    if(e.which == 27){
        // Close my modal window
    }
});

Comments

पहले कुछ ब्राउज़र का पता लगाएं?

— इना

मुझे quirksmode.org हमेशा विश्वसनीय लगता है जो यह पता लगाने के लिए कि ब्राउज़र में क्या काम करता है: quirksmode.org/js/keys.html । वहां आप सभी ब्राउज़रों में केवल keyupया keydownसंयोजन के साथ keyCodeकाम कर सकते हैं।

— फेलिक्स क्लिंग

मुझे लगता है कि इस सवाल का शीर्षक होना चाहिए "कैसे jquery के साथ भागने के प्रमुख प्रेस का पता लगाएं?" या उत्तर मूल जावास्क्रिप्ट में होना चाहिए ...

— विल्ट

$(document).on("keyup", function (e) {var code = e.keyCode || e.which; alert('key pressed: ' + code);});2014 से नमस्ते

— कलल एच। वैरावास

JQuery के साथ भागने की कुंजी के लिए किस कीकोड

— C'ur

Answer 1

नोट: keyCodeहै पदावनत हो रही उपयोग keyके बजाय।

function keyPress (e) {
    if(e.key === "Escape") {
        // write your logic here.
    }
}

यहाँ jsfiddle है

---

keyCode पदावनत हो रहा है

ऐसा लगता है keydownऔर keyupकाम करता है, भले ही keypressनहीं

---

$(document).keyup(function(e) {
     if (e.key === "Escape") { // escape key maps to keycode `27`
        // <DO YOUR WORK HERE>
    }
});

JQuery के साथ भागने के लिए कौन सा कीकोड है

Comments

to unbind: $ (document) .unbind ("कीअप", keyUpFunc);

— प्लैटसी

अनबाइंड करने के लिए आप ईवेंट पर एक नाम स्थान का भी उपयोग कर सकते हैं, $(document).on('keyup.unique_name', ...)और$(document).unbind('keyup.unique_name')

— लचलान मैकड।

किस कुंजी को दबाया गया था यह जांचने के लिए e.which (e.keycode के बजाय) का उपयोग करने की अनुशंसा की जाती है। jQuery केकोड और चारकोड को सामान्य करता है (पुराने ब्राउज़र में प्रयुक्त)

— DMTintner

@DMTintner: इसी विषय पर, जॉर्डन ब्रॉट stackoverflow.com/a/1160109/759452

— Adrien Be

आपको हमेशा उपयोग करना चाहिए ===।

— पांडेलेल

Answer 2

keydownघटना भागने के लिए ठीक काम करते हैं और आप का उपयोग करने के लिए अनुमति का लाभ मिलता है जाएगा keyCodeसभी ब्राउज़रों में। इसके अलावा, आपको documentशरीर के बजाय श्रोता को संलग्न करने की आवश्यकता है ।

मई 2016 को अपडेट करें

keyCodeअब पदावनत होने की प्रक्रिया में है और अधिकांश आधुनिक ब्राउज़र keyअब संपत्ति की पेशकश करते हैं, हालांकि आपको अभी के लिए सभ्य ब्राउज़र समर्थन के लिए एक कमबैक की आवश्यकता होगी (क्रोम और सफारी की वर्तमान रिलीज़ लिखने के समय) इसका समर्थन नहीं करते हैं।

अपडेट सितंबर 2018 evt.key अब सभी आधुनिक ब्राउज़रों द्वारा समर्थित है।

document.onkeydown = function(evt) {
    evt = evt || window.event;
    var isEscape = false;
    if ("key" in evt) {
        isEscape = (evt.key === "Escape" || evt.key === "Esc");
    } else {
        isEscape = (evt.keyCode === 27);
    }
    if (isEscape) {
        alert("Escape");
    }
};

Click me then press the Escape key

Comments

ध्यान दें, आप श्रोता को एक <input>तत्व में भी जोड़ सकते हैं और इसलिए यह केवल तभी ट्रिगर होगा जब इस तत्व पर ध्यान केंद्रित किया जाएगा।

— माइक

@ रैनमोकी: यह किस तरह का तत्व है (आईडी 'टेस्ट' वाला)? केवल वे तत्व जो फ़ोकस प्राप्त करने में सक्षम हैं (फॉर्म इनपुट, कंटेडिटेबल एलिमेंट्स, टैलिंडेक्स सेट वाले तत्व) फायर की ईवेंट।

— टिम डाउन

आप if (evt.key === 'Escape') {पदावनत का उपयोग करने के बजाय जाँच भी कर सकते हैंkeyCode

— कीस्कोक्स

@tobymackenzie: तो यह है। क्या यह अद्भुत नहीं है? मानकों-आधारित वेब विकास की बहादुर नई दुनिया में आपका स्वागत है।

— टिम डाउन

यदि आप जानना चाहते हैं कि क्या आप सुरक्षित रूप से उपयोग कर सकते हैं .key, तो caniuse.com/#feat=keyboardevent-key

— Jasper de Vries

Answer 3

जावास्क्रिप्ट का उपयोग करके आप कार्यशील jsfiddle की जांच कर सकते हैं

document.onkeydown = function(evt) {
    evt = evt || window.event;
    if (evt.keyCode == 27) {
        alert('Esc key pressed.');
    }
};

JQuery का उपयोग करके आप कार्यशील jsfiddle की जांच कर सकते हैं

jQuery(document).on('keyup',function(evt) {
    if (evt.keyCode == 27) {
       alert('Esc key pressed.');
    }
});

Answer 4

keyCode&& which& के लिए जाँच करें keyup||keydown

$(document).keydown(function(e){
   var code = e.keyCode || e.which;
   alert(code);
});

Comments

मैं देख रहा हूँ यह काम नहीं कर रहा है, jsfiddle.net/GWJVt सिर्फ भागने के लिए ... अजीब लगता है?

— रिगेल जूल

$ (document.body) .keypress () फायरिंग नहीं है

— मिथुन श्रीधरन

@ रीगेल: वास्तव में, कीपर के साथ ठीक से काम नहीं करना लगता है। जो भी हो, मैं 'अजीब' भाग नहीं लगा सकता।

— jAndy

कीप को कैरेक्टर कीज़ के लिए उठाया जाता है (की -डाउन और की-यूपी के विपरीत, जो नॉनचैकर कीज़ के लिए भी उठाए जाते हैं) जबकि की को दबाया जाता है।

— मार्था

Answer 5

इसके लिए सबसे अच्छा तरीका है फंक्शन करना

समारोह:

$.fn.escape = function (callback) {
    return this.each(function () {
        $(document).on("keydown", this, function (e) {
            var keycode = ((typeof e.keyCode !='undefined' && e.keyCode) ? e.keyCode : e.which);
            if (keycode === 27) {
                callback.call(this, e);
            };
        });
    });
};

उदाहरण:

$("#my-div").escape(function () {
    alert('Escape!');
})

Comments

दरअसल, ऐसा लगता है कि keypressभागने की चाबी में आग नहीं लगी है। कम से कम, मैक पर क्रोम में नहीं।

— सैमसन

इस प्रतिक्रिया के लिए धन्यवाद, मैंने एक अद्यतन और परिवर्तन नियम बनाया। keydownसमस्या का समाधान कीजिए।

— इविज़न स्टीफन स्टिपिक जूल

मैंने आपके समाधान को 'केवल एक बार' उपयोग करने में सक्षम होने के लिए अद्यतन किया। यहाँ एक उदाहरण है: jsfiddle.net/oxok5x2p ।

— dh

Answer 6

नीचे कोड है जो न केवल ईएससी कुंजी को निष्क्रिय करता है, बल्कि उस स्थिति की भी जांच करता है जहां इसे दबाया जाता है और स्थिति के आधार पर, यह कार्रवाई करेगा या नहीं।

इस उदाहरण में,

e.preventDefault();

ESC की-प्रेस क्रिया को अक्षम कर देगा।

आप इसके साथ डिव को छिपाने के लिए कुछ भी कर सकते हैं:

document.getElementById('myDivId').style.display = 'none';

जहां ईएससी कुंजी को दबाया जाता है, उसे भी ध्यान में रखा जाता है:

(e.target.nodeName=='BODY')

यदि आप इसे सभी के लिए लागू करना चाहते हैं तो आप इसे हटा सकते हैं। या आप इनपुट बॉक्स में कर्सर होने पर केवल इस क्रिया को लागू करने के लिए यहां INPUT को लक्षित कर सकते हैं।

window.addEventListener('keydown', function(e){
    if((e.key=='Escape'||e.key=='Esc'||e.keyCode==27) && (e.target.nodeName=='BODY')){
        e.preventDefault();
        return false;
    }
}, true);

Answer 7

मुझे लगता है कि सबसे सरल तरीका वेनिला जावास्क्रिप्ट है:

document.onkeyup = function(event) {
   if (event.key === 27){
     //do something here
   }
}

Comments

मेरी क्रोम (संस्करण 55.0.2883.95 (64-बिट)) पर मैं Escapeके रूप में event.keyऔर नहीं 27

— MosheZada

यह event.keyCode27 होना चाहिए।

— जेन्स टॉर्नेल