জাভাস্ক্রিপ্টে চাপা এরো কী ডিটেক্ট করার কোড নিচে দেওয়া হলো।
উদাহরণ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; }
.sample { font-size: 18px; font-weight: 500; }
</style>
</head>
<body>
<h1>Detecting the pressed arrow key</h1>
<div class="sample"></div>
<h3> Press any arrow key to know which arrow key has been pressed </h3>
<script>
let fillEle = document.querySelector(".sample");
document.body.addEventListener("keydown", (event) => {
switch (event.keyCode) {
case 37: fillEle.innerHTML = "Left key pressed"; break;
case 38: fillEle.innerHTML = "Up key pressed"; break;
case 39: fillEle.innerHTML = "Right key pressed"; break;
case 40: fillEle.innerHTML = "Down key pressed"; break;
}
});
</script>
</body> </html>কী কোড (Deprecated)
| কী | keyCode (Deprecated) | key (Modern) |
|---|---|---|
| Left | 37 | "ArrowLeft" |
| Up | 38 | "ArrowUp" |
| Right | 39 | "ArrowRight" |
| Down | 40 | "ArrowDown" |
মডার্ন পদ্ধতি (Recommended)
document.body.addEventListener("keydown", (event) => {
switch (event.key) {
case "ArrowLeft": fillEle.innerHTML = "Left key pressed"; break;
case "ArrowUp": fillEle.innerHTML = "Up key pressed"; break;
case "ArrowRight": fillEle.innerHTML = "Right key pressed"; break;
case "ArrowDown": fillEle.innerHTML = "Down key pressed"; break;
}
});event.keyCode ডিপ্রিকেটেড। event.key ব্যবহার করুন যা সরাসরি কী নেম রিটার্ন করে। event.code ফিজিক্যাল কী পজিশন দেয় (কীবোর্ড লেআউট নির্বিশেষে)।
