HTML DOM কীবোর্ড ইভেন্ট অবজেক্ট একটি ইভেন্টকে উপস্থাপন করে যখন ব্যবহারকারী কীবোর্ডে একটি কী টিপে।
সম্পত্তি
এখানে, “কীবোর্ড ইভেন্ট” নিম্নলিখিত বৈশিষ্ট্য এবং পদ্ধতি থাকতে পারে -
সম্পত্তি/পদ্ধতি | বিবরণ |
---|---|
altKey | এটি "ALT" কী টিপেছে কিনা তা ফেরত দেয় |
charCode | এটি কীটির ইউনিকোড অক্ষর কোড প্রদান করে |
কোড | এটি কীটির কোড ফেরত দেয় |
ctrlKey | এটি "CTRL" কী টিপেছে কিনা তা ফেরত দেয় |
getModifierState() | নির্দিষ্ট কী সক্রিয় হলে এটি সত্য এবং নিষ্ক্রিয় হলে মিথ্যা দেখায় |
ইজ কম্পোজিং | ইভেন্টের অবস্থা কম্পোজ করা হচ্ছে কিনা তা ফেরত দেয় |
কী | এটি ইভেন্ট দ্বারা উপস্থাপিত কীটির মূল মান প্রদান করে |
কী কোড | এটি কীটির ইউনিকোড অক্ষর কোড ফেরত দেয় যা ইভেন্টটিকে ট্রিগার করেছিল |
অবস্থান | এটি কীবোর্ড বা ডিভাইসে একটি কী এর অবস্থান ফেরত দেয় |
metaKey | কী ইভেন্টটি ট্রিগার করার সময় "মেটা" কী টিপানো হয়েছিল কিনা তা ফেরত দেয় |
পুনরাবৃত্তি | একটি কী বারবার চেপে রাখা হচ্ছে কি না, তা ফেরত দেয় |
shiftKey | কী ইভেন্টটি ট্রিগার করার সময় "SHIFT" কী টিপানো হয়েছিল কিনা তা ফেরত দেয় |
যা | এটি কীটির ইউনিকোড অক্ষর কোড ফেরত দেয় যা ইভেন্টটিকে ট্রিগার করেছিল |
ইভেন্টগুলি
এবং, কীবোর্ড ইভেন্ট অবজেক্ট -
-এ কাজ করে এমন ইভেন্টগুলি নীচে দেওয়া হলইভেন্ট | বর্ণনা |
---|---|
onkeydown | ইভেন্টটি ঘটে যখন ব্যবহারকারী একটি কী টিপে |
onkeypress | ইভেন্টটি ঘটে যখন ব্যবহারকারী একটি কী টিপে |
onkeyup | ইভেন্টটি ঘটে যখন ব্যবহারকারী একটি কী প্রকাশ করে |
উদাহরণ
আসুন কী-এর উদাহরণ দেখি সম্পত্তি -
<!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>
আউটপুট
এটি নিম্নলিখিত আউটপুট −
তৈরি করবেটেক্সট ফিল্ডে কিছু টাইপ করার আগে -
‘b’ টাইপ করার পর পাঠ্য ক্ষেত্রে -
‘B’ টাইপ করার পর পাঠ্য ক্ষেত্রে -