জাভাস্ক্রিপ্ট দিয়ে ক্যাপস লক সনাক্ত করুন

যে কেউ বুঝতে না পেরে যে কোনো সময়ে তাদের ক্যাপ লক কী চালু রাখতে সক্ষম। বেশিরভাগ ইনপুট টাইপ করার সময় ব্যবহারকারীরা সহজেই অবাঞ্ছিত ক্যাপ লক সনাক্ত করতে পারে, কিন্তু একটি ব্যবহার করার সময় password inputসমস্যা এতটা স্পষ্ট নয়। এটি ব্যবহারকারীর পাসওয়ার্ড ভুল হওয়ার দিকে পরিচালিত করে, যা একটি বিরক্তিকর। আদর্শভাবে বিকাশকারীরা ব্যবহারকারীকে জানাতে পারে যে তাদের ক্যাপ লক কী সক্রিয় করা হয়েছে।

একজন ব্যবহারকারীর কীবোর্ডের ক্যাপ লক চালু আছে কিনা তা সনাক্ত করতে, আমরা নিয়োগ করব KeyboardEventএর getModifierState পদ্ধতি:

document.querySelector('input(type=password)').addEventListener('keyup', function (keyboardEvent) {
    const capsLockOn = keyboardEvent.getModifierState('CapsLock');
    if (capsLockOn) {
        // Warn the user that their caps lock is on?
    }
});

আমি কখনই দেখিনি getModifierState আগে ব্যবহৃত, তাই আমি অন্বেষণ W3C ডকুমেন্টেশন অন্যান্য দরকারী মান আবিষ্কার করতে:

dictionary EventModifierInit : UIEventInit {
  boolean ctrlKey = false;
  boolean shiftKey = false;
  boolean altKey = false;
  boolean metaKey = false;

  boolean modifierAltGraph = false;
  boolean modifierCapsLock = false;
  boolean modifierFn = false;
  boolean modifierFnLock = false;
  boolean modifierHyper = false;
  boolean modifierNumLock = false;
  boolean modifierScrollLock = false;
  boolean modifierSuper = false;
  boolean modifierSymbol = false;
  boolean modifierSymbolLock = false;
};

getModifierState কী-কেন্দ্রিক ইভেন্টের সময় ব্যবহারকারীর কীবোর্ডের অন্তর্দৃষ্টি প্রদান করে। আমি যদি সম্পর্কে জানতাম getModifier আমার কর্মজীবনের আগে!

মেট্রিক্স বাস্তব ব্যবহারকারী নিরীক্ষণ অনুরোধ

7 অপরিহার্য জাভাস্ক্রিপ্ট ফাংশন
আমি জাভাস্ক্রিপ্টের প্রথম দিনগুলি মনে করি যেখানে আপনার প্রায় সবকিছুর জন্য একটি সাধারণ ফাংশন দরকার ছিল কারণ ব্রাউজার বিক্রেতারা বৈশিষ্ট্যগুলি ভিন্নভাবে প্রয়োগ করেছিল, এবং কেবল প্রান্ত বৈশিষ্ট্যগুলি নয়, মৌলিক বৈশিষ্ট্যগুলি, যেমন addEventListener এবং attachEvent. সময় পরিবর্তিত হয়েছে কিন্তু এখনও কিছু ফাংশন আছে প্রতিটি বিকাশকারীর উচিত…

CSS গোলাকার কোণ
CSS এর সাথে গোলাকার কোণ তৈরি করার ক্ষমতা চিত্রগুলি অন্তর্ভুক্ত করার প্রয়োজন ছাড়াই সূক্ষ্ম ডিজাইনের উন্নতির সম্ভাবনা উন্মুক্ত করে। CSS বৃত্তাকার কোণগুলি এইভাবে সার্ভারে চিত্র এবং অনুরোধ তৈরি করতে আমাদের সময় বাঁচায়। আজ, CSS সহ গোলাকার কোণগুলি সমস্ত দ্বারা সমর্থিত…