কম্পিউটার টিউটোরিয়াল

HTML DOM KeyboardEvent অবজেক্ট

ওভারভিউ

HTML DOM KeyboardEvent অবজেক্ট কীবোর্ডে কোনো কী প্রেস করার ইভেন্টকে রিপ্রেজেন্ট করে।

প্রপার্টিজ

প্রপার্টি/মেথড বিবরণ
altKey "ALT" কী প্রেস হয়েছে কিনা তা রিটার্ন করে।
charCode কীটির ইউনিকোড ক্যারেক্টার কোড রিটার্ন করে।
code কীটির কোড রিটার্ন করে।
ctrlKey "CTRL" কী প্রেস হয়েছে কিনা তা রিটার্ন করে।
getModifierState() নির্দিষ্ট কী এক্টিভেটড কিনা তা true/false রিটার্ন করে।
isComposing ইভেন্টের কম্পোজিং স্টেট রিটার্ন করে।
key ইভেন্টে রিপ্রেজেন্ট করা কীটির কী ভ্যালু রিটার্ন করে।
keyCode ইভেন্ট ট্রিগার করা কীটির ইউনিকোড ক্যারেক্টার কোড রিটার্ন করে।
location কীবোর্ড বা ডিভাইসে কীটির লোকেশন রিটার্ন করে।
metaKey "meta" কী প্রেস হয়েছিল কিনা তা রিটার্ন করে।
repeat কীটি বারবার হোল্ড করা হচ্ছে কিনা তা রিটার্ন করে।
shiftKey "SHIFT" কী প্রেস হয়েছিল কিনা তা রিটার্ন করে।
which ইভেন্ট ট্রিগার করা কীটির ইউনিকোড ক্যারেক্টার কোড রিটার্ন করে।

ইভেন্টস

নিচের ইভেন্টগুলো KeyboardEvent অবজেক্টের ওপর কাজ করে:

ইভেন্ট বিবরণ
onkeydown ইভেন্ট ঘটে যখন ব্যবহারকারী কী প্রেস করছে।
onkeypress ইভেন্ট ঘটে যখন ব্যবহারকারী কী প্রেস করে।
onkeyup ইভেন্ট ঘটে যখন ব্যবহারকারী কী রিলিজ করে।

উদাহরণ

key প্রপার্টির উদাহরণ:

<!DOCTYPE html> <html> <head> <title>KeyboardEvent key</title> <style>    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } </style> </head> <body> <form> <fieldset> <legend>KeyboardEvent-key</legend> <label>Fill in the blanks: <input type="text" id="textSelect" placeholder="__ for Ball" onkeypress="getEventData(event)" autocomplete="off"> </label> <div id="divDisplay"></div> </fieldset> </form> <script>    var divDisplay = document.getElementById("divDisplay");    var textSelect = document.getElementById("textSelect");    function getEventData(InputEvent) {       if(InputEvent.key === 'B')          divDisplay.textContent = 'Correct Answer';       else if(InputEvent.key === 'b')          divDisplay.textContent = 'Close call, you might have caps lock turned off';       else          divDisplay.textContent = 'Try Again, '+textSelect.placeholder;       textSelect.textContent = '';    } </script> </body> </html>

আউটপুট

টেক্সট ফিল্ডে কিছু টাইপ করার আগে:

HTML DOM KeyboardEvent অবজেক্ট

টেক্সট ফিল্ডে 'b' টাইপ করার পর:

HTML DOM KeyboardEvent অবজেক্ট

টেক্সট ফিল্ডে 'B' টাইপ করার পর:

HTML DOM KeyboardEvent অবজেক্ট

  1. HTML DOM blockquote অবজেক্ট

  2. HTML DOM KeyboardEvent altKey প্রপার্টি

  3. HTML DOM HR অবজেক্ট

  4. HTML DOM Ul অবজেক্ট