javascript - atscript - जावास्क्रिप्ट इन भाषाओं से प्रेरित



जावास्क्रिप्ट में तीर कुंजी प्रेस का पता लगाना (11)

event.key === "तीर राइट" ...

अधिक हालिया और अधिक क्लीनर: event.key उपयोग event.key । कोई मनमाना संख्या कोड नहीं! यदि आप पारदर्शी हैं या जानते हैं कि आपके उपयोगकर्ता आधुनिक ब्राउज़र पर हैं, तो इसका इस्तेमाल करें!

node.addEventListener('keydown', function(event) {
    const key = event.key; // "ArrowRight", "ArrowLeft", "ArrowUp", or "ArrowDown"
});

Verbose हैंडलिंग:

switch (event.key) {
    case "ArrowLeft":
        // Left pressed
        break;
    case "ArrowRight":
        // Right pressed
        break;
    case "ArrowUp":
        // Up pressed
        break;
    case "ArrowDown":
        // Down pressed
        break;
}

आप "w", "a", "s", "d" , या किसी अन्य कुंजी की जांच के लिए आसानी से इसका विस्तार कर सकते हैं

मोज़िला डॉक्स

समर्थित ब्राउज़र

पीएस event.code तीरों के लिए एक ही है

https://code.i-harness.com

जब तीर कुंजियों में से एक दबाया जाता है तो मैं कैसे पता लगा सकता हूं? मैंने इसका पता लगाने के लिए इसका इस्तेमाल किया:

function checkKey(e) {
    var event = window.event ? window.event : e;
    console.log(event.keyCode)
}

हालांकि यह हर दूसरी कुंजी के लिए काम करता है, यह तीर कुंजियों के लिए नहीं था (शायद क्योंकि ब्राउज़र को डिफ़ॉल्ट रूप से इन चाबियों पर स्क्रॉल करना होता है)।


आधुनिक जवाब क्योंकि keyCode अब कुंजी के पक्ष में बहिष्कृत है:

document.onkeydown = function (e) {
    switch (e.key) {
        case 'ArrowUp':
            // up arrow
            break;
        case 'ArrowDown':
            // down arrow
            break;
        case 'ArrowLeft':
            // left arrow
            break;
        case 'ArrowRight':
            // right arrow
    }
};

कुंजी कोड %=37 और &=38 ... और केवल तीर कुंजी को बाएं = 37 अप = 38 नियंत्रित करें

function IsArrows (e) {
   return ( !evt.shiftKey && (e.keyCode >= 37 && e.keyCode <= 40)); 
}

जब तक मैं इस पोस्ट में नहीं आया तब तक मैं इस जवाब की भी तलाश कर रहा था।

मुझे अपनी समस्या के प्रति सौजन्य से अलग-अलग चाबियों के कीकोड को जानने का एक और समाधान मिला है। मैं बस अपना समाधान साझा करना चाहता था।

कंसोल में मान लिखने के लिए बस keyup / keydown ईवेंट का उपयोग करें / event.keyCode का उपयोग करके event.keyCode अलर्ट करें। पसंद-

console.log(event.keyCode) 

// or

alert(event.keyCode)

- रुपएएम


तीर कुंजी केवल onkeydown द्वारा ट्रिगर की जाती है, onkeypress नहीं

कीकोड हैं:

  • बायां = 37
  • ऊपर = 38
  • सही = 3 9
  • नीचे = 40

मैं उन्हें jQuery के साथ फंसाने में सक्षम हूं:

$(document).keypress(function (eventObject) {
    alert(eventObject.keyCode);
});

एक उदाहरण: http://jsfiddle.net/AjKjU/


यह पुस्तकालय चट्टानों! https://craig.is/killing/mice

Mousetrap.bind('up up down down left right left right b a enter', function() {
    highlight([21, 22, 23]);
});

यद्यपि उस पृष्ठ में कोड को हाइलाइट करने के लिए आपको अनुक्रम को थोड़ा तेज़ करने की आवश्यकता है।


यहां एक उदाहरण कार्यान्वयन है:

var targetElement = $0 || document.body;

function getArrowKeyDirection (keyCode) {
  return {
    37: 'left',
    39: 'right',
    38: 'up',
    40: 'down'
  }[keyCode];
}

function isArrowKey (keyCode) {
  return !!getArrowKeyDirection(keyCode);
}

targetElement.addEventListener('keydown', function (event) {
  var direction,
      keyCode = event.keyCode;

  if (isArrowKey(keyCode)) {
    direction = getArrowKeyDirection(keyCode);

    console.log(direction);
  }
});

वह छोटा है।

function IsArrows (e) { return (e.keyCode >= 37 && e.keyCode <= 40); }


संभवतः सबसे कम फॉर्मूलेशन:

document.onkeydown = function(e) {
    switch (e.keyCode) {
        case 37:
            alert('left');
            break;
        case 38:
            alert('up');
            break;
        case 39:
            alert('right');
            break;
        case 40:
            alert('down');
            break;
    }
};

डेमो (उपयोगकर्ता एंगस अनुदान के लिए धन्यवाद): http://jsfiddle.net/angusgrant/E3tE6/

यह क्रॉस ब्राउज़र काम करना चाहिए। यदि कोई ऐसा ब्राउज़र है जहां यह काम नहीं करता है तो एक टिप्पणी छोड़ दें।

कुंजी कोड प्राप्त करने के अन्य तरीके हैं (e.which, e.charCode, और window.event ई के बजाय), लेकिन उन्हें आवश्यक नहीं होना चाहिए। आप उनमें से अधिकतर http://www.asquare.net/javascript/tests/KeyCode.html पर आज़मा सकते हैं। ध्यान दें कि event.keycode फ़ायरफ़ॉक्स में ऑनकीप्रेस के साथ काम नहीं करता है, लेकिन यह ऑनकीडाउन के साथ काम करता है।


function checkArrowKeys(e){
    var arrs= ['left', 'up', 'right', 'down'], 
    key= window.event? event.keyCode: e.keyCode;
    if(key && key>36 && key<41) alert(arrs[key-37]);
}
document.onkeydown= checkArrowKeys;





keyboard-events