ক্যাপস লকটি জাভাস্ক্রিপ্ট ব্যবহার করা হচ্ছে কিনা আপনি কীভাবে বলবেন?


242

ক্যাপস লকটি জাভাস্ক্রিপ্ট ব্যবহার করা হচ্ছে কিনা আপনি কীভাবে বলবেন?

যদিও একটি সতর্কতামূলক: আমি এটি গুগল করেছিলাম এবং আমি যে সর্বোত্তম সমাধানটি খুঁজে পেতে পারি তা হ'ল প্রতিটি ইনপুটটির সাথে একটি onkeypressইভেন্ট সংযুক্তি করে, তবে প্রতিবার পরীক্ষা করা চিঠিটি বড় হাতের অক্ষর ছিল কিনা এবং যদি তা হয় তবে তা শিফটটি চেপে রাখা হয়েছে কিনা তা পরীক্ষা করে দেখুন। যদি এটি না হয়, সুতরাং ক্যাপস লকটি অবশ্যই চালু থাকতে হবে। এটিকে সত্যই নোংরা এবং নষ্ট মনে হচ্ছে - অবশ্যই এর চেয়ে ভাল উপায় আছে?


198
আমার ব্যবহারকারীদের অনেক উপায়ে তাদের ফর্মগুলি পূরণ করুন কারণ এটি পছন্দ করুন।
নিকফ

7
@ এনএনএফ: যদি এর কারণ হয় তবে আপনি কেন ইনপুটটিতে একটি রেইগ এক্সপ্যাক চালাবেন না এবং যদি খুব বেশি আপার কেস লেটার থাকে তবে চেঁচামেচি বন্ধ করতে বলেন না?
কিছু

155
এটি করার আরও অনেক ভাল কারণ আছে। যদি কোনও ব্যবহারকারী কোনও পাসওয়ার্ড প্রবেশ করিয়ে দিচ্ছে তবে তাদের ক্যাপসলক চালু থাকলে তাদের সতর্ক করতে এটি খুব কার্যকর হবে be
টি এনগুইন

23
দেখে মনে হচ্ছে ব্রাউজার একটি "Caps Lock চালু আছে" সতর্কবার্তা বাস্তবায়ন করা উচিত যখন ব্যবহারকারীদের টাইপ input type=passwordক্ষেত্র (জন্য ইমেইল ঠিকানা বৈধতা অনুরূপ input type=emailChrome এ, ইত্যাদি)
nothingisnecessary

8
দুর্দান্ত প্রশ্ন, তবে গৃহীত উত্তরটি 8 বছরের পুরানো। আরও ভাল প্রতিক্রিয়াটি এখানে রয়েছে
ম্যাক

উত্তর:


95

আপনি এটি চেষ্টা করে দেখতে পারেন .. একটি কাজের উদাহরণ যুক্ত করেছেন। যখন ফোকাসটি ইনপুটটিতে থাকে, ক্যাপস লকটি চালু করা নেতৃত্বে লাল হয়ে যায় অন্যথায় সবুজ। (ম্যাক / লিনাক্স পরীক্ষা করা হয়নি)

দ্রষ্টব্য: উভয় সংস্করণ আমার জন্য কাজ করছে। মন্তব্যে গঠনমূলক ইনপুটগুলির জন্য ধন্যবাদ।

পুরানো সংস্করণ: https://jsbin.com/mahenes/edit?js,output

এছাড়াও, এখানে একটি পরিবর্তিত সংস্করণ রয়েছে (কেউ ম্যাক পরীক্ষা করে নিশ্চিত করতে পারেন)

নতুন সংস্করণ: https://jsbin.com/xiconuv/edit?js, আউটপুট

নতুন সংস্করণ:

function isCapslock(e){
    const IS_MAC = /Mac/.test(navigator.platform);

    const charCode      = e.charCode;
    const shiftKey      = e.shiftKey;

    if (charCode >= 97 && charCode <= 122){
      capsLock = shiftKey;
    } else if (charCode >= 65 && charCode <= 90 
               && !(shiftKey && IS_MAC)){
      capsLock = !shiftKey;
    }

    return capsLock;
}

পুরাতন রুপ:

ফাংশন ক্যাপস্লক (ই) {

e = (e) ? e : window.event;

var charCode = false;
if (e.which) {
    charCode = e.which;
} else if (e.keyCode) {
    charCode = e.keyCode;
}

var shifton = false;
if (e.shiftKey) {
    shifton = e.shiftKey;
} else if (e.modifiers) {
    shifton = !!(e.modifiers & 4);
}

if (charCode >= 97 && charCode <= 122 && shifton) {
    return true;
}

if (charCode >= 65 && charCode <= 90 && !shifton) {
    return true;
}

return false;

}

আন্তর্জাতিক অক্ষরগুলির জন্য, নিম্নলিখিত কীগুলির প্রয়োজন অনুসারে অতিরিক্ত চেক যুক্ত করা যেতে পারে। আপনি আগ্রহী এমন অক্ষরগুলির জন্য আপনার কীকোড পরিসরটি পেতে হবে, একটি কীম্যাপিং অ্যারে ব্যবহার করে আপনি যে সমস্ত বৈধ ব্যবহারের কেসগুলি সম্বোধন করছেন তা ধরে রাখতে পারে ...

বড় হাতের এজেড বা 'Ä', 'Ö', 'Ü', ছোট হাতের জেড বা 0-9 বা 'ä', 'ö', 'ü'

উপরের কীগুলি কেবল নমুনা উপস্থাপনা।


1
এটি সম্ভবত সেরা বাস্তবায়ন নয় তবে আমি যখন এটি লিখেছিলাম তখন আমি এটিকে সহজ রাখার চেষ্টা করছিলাম। আমি মনে করি আপনি বিভিন্ন ব্রাউজারে আবশ্যক কদর্যতা সঙ্গে সত্যই এটি করতে পারেন।

2
আমি খুঁজে পেয়েছি যে কীডাউন (ক্রোমে) এর সাথে এটি ব্যবহারের ফলে সমস্ত কোড ক্যাপ হিসাবে নেওয়া হবে। আমি কিপ্রেস ব্যবহার করলে এটি কাজ করে।
টিম

2
সমস্ত আন্তর্জাতিক চরিত্রের জন্য প্রতিটি সম্ভাব্য চরিত্রের সংমিশ্রণ সন্ধান করা কিছু ক্ষেত্রে মিস করার জন্য নিয়তিযুক্ত। কেসিং চেক করার পরিবর্তে টুঅপার / লোয়ার কেস পদ্ধতিগুলি ব্যবহার করুন।
অবাক

3
সুপারিশ করা হচ্ছে যে একটি উত্তর সম্পূর্ণ মিথ্যা-কনফিউজিং চারকোড এবং এসকিআই (!!!) - এত উত্সাহ পেতে পারে। কেউ কি কখনও চেক করেনি ???
গেমএলচেমিস্ট

1
নোট করুন যে মোজিলার মতে , ইভেন্ট। যা ওয়েব মান থেকে সরানো হয়েছে।
সত্যবাদিতা

130

JQuery এ,

$('#example').keypress(function(e) { 
    var s = String.fromCharCode( e.which );
    if ( s.toUpperCase() === s && s.toLowerCase() !== s && !e.shiftKey ) {
        alert('caps is on');
    }
});

ব্যাকস্পেস কী এর মতো ভুলটি এড়িয়ে চলুন s.toLowerCase() !== s


5
প্রকৃতপক্ষে ... থেকে চেককোড আমার এমনকি চেক করার প্রয়োজনীয়তাও দূর করে দিয়েছে। তবে এটি লক্ষ্য করা উচিত যে কীডাউন এবং কী-টিপস বিভিন্ন চারকোড দেয় যা আমি প্রথমে ভুল হয়ে গিয়েছিলাম।
শেয়া

4
-1 বিসি এটি কেবলমাত্র কাজ করে যদি তারা সিএপিএস চালু থাকাকালীন শিফট টিপেনি।

1
যদি কেউ বুটস্ট্র্যাপের সাথে লাইভ উদাহরণ দেখতে চান তবে আপনি এখানে দেখতে পারেন বুটপ্লাই.কম
গোবিন্দ

এই উত্তরটি আমার পক্ষে কার্যকর ছিল। @D_N দ্বারা উল্লিখিত ত্রুটির কারণে আমি এই উত্তরে শর্তসাপেক্ষে উন্নতি করেছি, শিফট টিপানোর সময় এটি কাজ করে না।
সেবাসএসবিএম

105

আপনি KeyboardEventসাম্প্রতিক ব্রাউজারগুলিতে ক্যাপস লক সহ অসংখ্য কী সনাক্ত করতে একটি ব্যবহার করতে পারেন ।

getModifierStateফাংশন জন্য রাষ্ট্র ব্যবস্থা করবেন |

  • অল্টার
  • AltGraph
  • ক্যাপস লক
  • নিয়ন্ত্রণ
  • Fn (অ্যান্ড্রয়েড)
  • মেটা
  • NumLock সক্রিয়, নিষ্ক্রিয়
  • ওএস (উইন্ডোজ এবং লিনাক্স)
  • স্ক্রল লক
  • পরিবর্তন

এই ডেমোটি মোবাইল ( ক্যানিজ ) সহ সমস্ত বড় ব্রাউজারগুলিতে কাজ করে ।

passwordField.addEventListener( 'keydown', function( event ) {
  var caps = event.getModifierState && event.getModifierState( 'CapsLock' );
  console.log( caps ); // true when you press the keyboard CapsLock key
});

6
আমি এটি একটি ডুপ / অনুরূপ প্রশ্নের উত্তর দিয়েছি এবং অন্য একজন ব্যবহারকারী আপডেট করেছেন যে এটিতে এখন Chrome সমর্থন রয়েছে। আমি এটি নিশ্চিত করেছি, সুতরাং এখন সমস্ত বড় ব্রাউজার জুড়ে কাজ করে - এবং এই প্রশ্নের সর্বোত্তম সমাধান হওয়া উচিত
ইয়ান ক্লার্ক ২

caniuse.com/#search=getModifierState বলছে এটি বর্তমানে সাফারি (এখনও?) এ সমর্থিত নয়। সুতরাং সমস্ত বড় ব্রাউজার জুড়ে এখনও ঠিক না হতে পারে।
জেনস কুইজ

2
এটি এখন সাফারিতে সমর্থিত।
মট্টি

1
এবং তবু এটি ক্যাপস্লক প্রেসটি সনাক্ত করে এবং ব্যবহারকারী যখন ফর্মটিতে প্রবেশ করে তখন সাধারণ ক্যাপস্লক রাষ্ট্রটি পেতে পারে না ...
স্পার্ক

ক্যাপস লক কীটি অফ পজিশনে টিপানো ব্যতীত এটি কাজ করে বলে মনে হচ্ছে । পরবর্তী কী টিপুন না হওয়া পর্যন্ত এটি ইনপুটটি গ্রহণ করে না। এটি ওএস এক্সের জন্য ক্রোমে ছিল sure এটি নিশ্চিত নয় যে এটি ব্রাউজার এবং ওএস জুড়ে ছড়িয়ে আছে is
আশরাফ স্লামাং

24

আপনি ডকুমেন্টটিতে একটি কীপ্রেস ক্যাপচার ব্যবহার করে "চিঠি বড় হাতের অক্ষর এবং কোনও শিফ্ট চাপা নেই" ব্যবহার করে ক্যাপস লক সনাক্ত করতে পারেন। তবে আপনি আরও নিশ্চিত হন যে কোনও অন্য কীপ্রেস হ্যান্ডলার নথির হ্যান্ডলারের কাছে যাওয়ার আগে ইভেন্টের বুদ্বুদটিকে পপ করে না।

document.onkeypress = function ( e ) {
  e = e || window.event;
  var s = String.fromCharCode( e.keyCode || e.which );
  if ( (s.toUpperCase() === s) !== e.shiftKey ) {
    // alert('caps is on')
  }
}

ব্রাউজারগুলিতে ক্যাপচারিং পর্বের সময় আপনি ইভেন্টটি দখল করতে পারেন যা সমর্থন করে তবে এটি সমস্ত ব্রাউজারগুলিতে কাজ করবে না বলে কিছুটা অর্থহীন বলে মনে হয়।

ক্যাপস লক স্থিতিটি সনাক্ত করার জন্য অন্য কোনও উপায় সম্পর্কে আমি ভাবতে পারি না। চেকটি যাইহোক সহজ এবং যদি সনাক্তযোগ্য অক্ষরগুলি টাইপ করা থাকে তবে ভাল ... তবে সনাক্তকরণ প্রয়োজনীয় ছিল না।

এই গত বছর 24 টি উপায় নিয়ে একটি নিবন্ধ ছিল । বেশ ভাল, কিন্তু আন্তর্জাতিক চরিত্র সমর্থন অভাব ( toUpperCase()এটি কাছাকাছি পেতে ব্যবহার )।


এটি আসলে আমি যা খুঁজছিলাম। এটি লাতিন এবং সিরিলিক স্ট্রিংগুলির সাথে কাজ করে। ধন্যবাদ!
ম্লাদেন জানজেটোভিক

এটি ভালভাবে কাজ করে তবে স্পেস এবং সংখ্যার মতো কীগুলি সতর্কতাটি নির্দেশ করে। একটি (একইভাবে সংক্ষিপ্ত / মার্জিত) কর্মসংস্থান জানেন?

1
এছাড়াও, আপনি যে অসম্পূর্ণতাটি নোট করেছেন তা ভাল তবে এটি এখনও অসম্পূর্ণ। এই পদ্ধতিতে কীভাবে এটি ঠিক করবেন তা নিশ্চিত নন।

11

অনেকগুলি বিদ্যমান উত্তর যখন শিফট টিপবে না তখন ক্যাপস লক অনের জন্য পরীক্ষা করবে কিন্তু আপনি শিফট টিপলে এবং ছোট হাতের অক্ষর পেয়ে থাকলে তা পরীক্ষা করে দেখবে না, বা এটি পরীক্ষা করবে তবে ক্যাপস লক বন্ধ রয়েছে কিনা তা পরীক্ষা করে দেখবে না, বা এটি পরীক্ষা করবে তবে নন-আলফা কীগুলি 'বন্ধ' হিসাবে বিবেচনা করবে। এখানে একটি অভিযোজিত jQuery সমাধান যা একটি আলফা কী ক্যাপস (শিফট বা কোনও শিফট) দিয়ে চেপে রাখা হলে একটি সতর্কতা প্রদর্শন করবে, আলফা কীটি ক্যাপস ছাড়াই চাপলে সতর্কতাটি বন্ধ করে দেবে, তবে সতর্কতাটি বন্ধ বা কখন চালু হবে না সংখ্যা বা অন্যান্য কী চাপানো হয়।

$("#password").keypress(function(e) { 
    var s = String.fromCharCode( e.which );
    if ((s.toUpperCase() === s && s.toLowerCase() !== s && !e.shiftKey)|| //caps is on
      (s.toUpperCase() !== s && s.toLowerCase() === s && e.shiftKey)) {
        $("#CapsWarn").show();
    } else if ((s.toLowerCase() === s && s.toUpperCase() !== s && !e.shiftKey)||
      (s.toLowerCase() !== s && s.toUpperCase() === s && e.shiftKey)) { //caps is off
        $("#CapsWarn").hide();
    } //else upper and lower are both same (i.e. not alpha key - so do not hide message if already on but do not turn on if alpha keys not hit yet)
  });

11

জিকুয়েরিতে। এটি ফায়ারফক্সে ইভেন্ট হ্যান্ডলিংকে কভার করে এবং অপ্রত্যাশিত বড় হাতের অক্ষর এবং ছোট হাতের অক্ষর উভয়ই জন্য পরীক্ষা করে দেখবে। এটি <input id="password" type="password" name="whatever"/>আইডি ' capsLockWarning' সহ একটি উপাদান এবং একটি পৃথক উপাদানকে প্রস্তাব দেয় যা আমরা দেখাতে চাইছি সতর্কতা রয়েছে (তবে অন্যথায় লুকানো রয়েছে)।

$('#password').keypress(function(e) {
    e = e || window.event;

    // An empty field resets the visibility.
    if (this.value === '') {
        $('#capsLockWarning').hide();
        return;
    }

    // We need alphabetic characters to make a match.
    var character = String.fromCharCode(e.keyCode || e.which);
    if (character.toUpperCase() === character.toLowerCase()) {
        return;
    }

    // SHIFT doesn't usually give us a lowercase character. Check for this
    // and for when we get a lowercase character when SHIFT is enabled. 
    if ((e.shiftKey && character.toLowerCase() === character) ||
        (!e.shiftKey && character.toUpperCase() === character)) {
        $('#capsLockWarning').show();
    } else {
        $('#capsLockWarning').hide();
    }
});

আমি নিশ্চিত না কেন, তবে এই পদ্ধতিটি প্রথম কীপ্রেসে কাজ করে না (কেবলমাত্র ক্রোমে পরীক্ষিত)।

এটি ফাঁকা ক্ষেত্রটি লুকানোর সমস্যা হতে পারে? কমপক্ষে ক্রোমে, আমি এটি সঠিকভাবে কাজ করতে পারি না। এটি স্বয়ংক্রিয়ভাবে অন্যান্য অনেক ব্রাউজারে ঘটে (কমপক্ষে আমার সংস্করণে, নীচে) কারণ ব্যাকস্পেসগুলি এমএসএসজি গণনা করে ফাঁকা করে দেয়।

দ্রষ্টব্য : আপনি যেমন সঠিকভাবে এখানে ব্যবহার করেছেন, আপনাকে keypressইনপুটটিতে বিভিন্ন ক্যাসিংয়ের ব্যবহার করতে ইভেন্টটি ব্যবহার করতে হবে, কারণ উভয়ই keydownএবং keyupসর্বদা বড় হাতের অক্ষরে ফিরে আসবে । ফলস্বরূপ, এটি ক্যাপস্লক কীটি চালিত করবে না ... আপনি যদি সংযুক্ত করার পরিকল্পনা করেনe.originalEvent.getModifierState('CapsLock')
কাইলমিট

6

এখানে শীর্ষস্থানীয় উত্তরগুলি বেশ কয়েকটি কারণে (মৃত লিঙ্ক এবং অসম্পূর্ণ সমাধান সহ অ-মন্তব্য কোড) আমার জন্য কাজ করে না। সুতরাং আমি কয়েক ঘন্টা প্রত্যেকের চেষ্টা করার চেষ্টা করেছিলাম এবং যথাসাধ্য চেষ্টা করতে পারি: জ্যাকুয়ারি এবং নন-জিক্যুরি সহ আমার এখানে।

jQuery এর

নোট করুন যে jQuery ইভেন্ট অবজেক্টকে স্বাভাবিক করে তোলে তাই কিছু চেক অনুপস্থিত। আমি এটিকে সমস্ত পাসওয়ার্ড ক্ষেত্রেও সংকীর্ণ করেছি (যেহেতু এটির প্রয়োজনের সবচেয়ে বড় কারণ) এবং একটি সতর্কতা বার্তা যুক্ত করেছি। এটি ক্রোম, মজিলা, অপেরা এবং আই 6-8 এ পরীক্ষা করা হয়েছে। সংখ্যা বা স্পেস টিপলে স্থিতিশীল এবং সমস্ত ক্যাপস্লক রাজ্যগুলিকে ছাড়বে CE

/* check for CAPS LOCK on all password fields */
$("input[type='password']").keypress(function(e) {

    var $warn = $(this).next(".capsWarn"); // handle the warning mssg
    var kc = e.which; //get keycode
    var isUp = (kc >= 65 && kc <= 90) ? true : false; // uppercase
    var isLow = (kc >= 97 && kc <= 122) ? true : false; // lowercase
    // event.shiftKey does not seem to be normalized by jQuery(?) for IE8-
    var isShift = ( e.shiftKey ) ? e.shiftKey : ( (kc == 16) ? true : false ); // shift is pressed

    // uppercase w/out shift or lowercase with shift == caps lock
    if ( (isUp && !isShift) || (isLow && isShift) ) {
        $warn.show();
    } else {
        $warn.hide();
    }

}).after("<span class='capsWarn error' style='display:none;'>Is your CAPSLOCK on?</span>");

JQuery ছাড়া

অন্যান্য কিছু jQuery- কম সমাধানগুলির মধ্যে আইই ফলব্যাকের ঘাটতি রয়েছে। @ জাপা এটি প্যাচ করল।

document.onkeypress = function ( e ) {
    e = (e) ? e : window.event;

    var kc = ( e.keyCode ) ? e.keyCode : e.which; // get keycode
    var isUp = (kc >= 65 && kc <= 90) ? true : false; // uppercase
    var isLow = (kc >= 97 && kc <= 122) ? true : false; // lowercase
    var isShift = ( e.shiftKey ) ? e.shiftKey : ( (kc == 16) ? true : false ); // shift is pressed -- works for IE8-

    // uppercase w/out shift or lowercase with shift == caps lock
    if ( (isUp && !isShift) || (isLow && isShift) ) {
        alert("CAPSLOCK is on."); // do your thing here
    } else {
        // no CAPSLOCK to speak of
    }

}

দ্রষ্টব্য: @ বার্গার, @ জো লিভারসেড, এবং @ জাপা এর সমাধানগুলি দেখুন, এবং @ পাভেল আজানভ দ্বারা নির্মিত প্লাগইন, যা আমি চেষ্টা করে দেখিনি তবে এটি একটি ভাল ধারণা। যদি কেউ এ-জা-জেড ছাড়িয়ে স্কোপ বাড়ানোর কোনও উপায় জানেন তবে দয়া করে এডিট করুন। এছাড়াও, এই প্রশ্নের jQuery সংস্করণগুলি সদৃশ হিসাবে বন্ধ রয়েছে, তাই আমি এখানে উভয়ই পোস্ট করছি।


4
একটি ভাল সমাধানে সর্বদা ইংরেজি অক্ষরের AZ এর বাইরে অক্ষরের জন্য সমর্থন অন্তর্ভুক্ত করা উচিত। অন্য যে কোনও সমাধান হ'ল প্রায় সমস্ত অ-ইংরাজী ভাষার অপমান।
ভীতি

6

আমরা getModifierStateক্যাপস লকটি পরীক্ষা করতে ব্যবহার করি এটি কেবল মাউস বা কীবোর্ড ইভেন্টের সদস্য যাতে আমরা এটি ব্যবহার করতে পারি না onfocus। পাসওয়ার্ড ক্ষেত্রটি সবচেয়ে সাধারণ দুটি উপায়ে ফোকাস অর্জন করবে তা হল একটি ক্লিক বা একটি ট্যাব। আমরা onclickইনপুটটির মধ্যে মাউস ক্লিকের জন্য পরীক্ষা করতে ব্যবহার করি এবং আমরা onkeyupপূর্ববর্তী ইনপুট ক্ষেত্র থেকে একটি ট্যাব সনাক্ত করতে ব্যবহার করি । যদি পাসওয়ার্ড ক্ষেত্রটি পৃষ্ঠার একমাত্র ক্ষেত্র এবং স্বতঃ-কেন্দ্রীভূত হয় তবে প্রথম কীটি প্রকাশ না হওয়া পর্যন্ত ঘটনাটি ঘটবে না, যা ঠিক তবে আদর্শ নয়, আপনি পাসওয়ার্ডের ক্ষেত্রটি অর্জন করার পরে ক্যাপস লক সরঞ্জাম টিপসটি সত্যই প্রদর্শন করতে চান ফোকাস করুন, তবে বেশিরভাগ ক্ষেত্রেই এই সমাধানটি কবজির মতো কাজ করে।

এইচটিএমএল

<input type="password" id="password" onclick="checkCapsLock(event)" onkeyup="checkCapsLock(event)" />

জাতীয়

function checkCapsLock(e) {
  if (e.getModifierState("CapsLock")) {
    console.log("Caps");
  }
}

https://codepen.io/anon/pen/KxJwjq


চমত্কার! আমার বাস্তবায়নে সহজ, সংক্ষিপ্ত এবং ত্রুটিহীন।
চমত্কার

1
@ রায়ান: অবদানের জন্য ধন্যবাদ! এটি কোডের একটি ভাল এবং পরিষ্কার উদাহরণ, যদিও আমি আপনার উত্তরটি মূলত 2015 সালের মোটির জবাবের সমান , যেখানে আপনি দুজনেই নিয়োগ করেছেনevent.getModifierState("CapsLock").
ম্যাক

5

আমি জানি এটি একটি পুরানো বিষয় তবে ভেবেছিলাম যে এটি অন্যকে সাহায্য করে যদি আমি তা খাওয়াতাম। প্রশ্নের উত্তরের কোনওটিই আইই 8 তে কাজ করছে বলে মনে হচ্ছে না। তবে আমি এই কোডটি পেয়েছি যা আইই 8 তে কাজ করে। (এখনও IE8 এর নীচে কিছু পরীক্ষা করে নি)। এটি প্রয়োজন হলে jQuery এর জন্য সহজেই সংশোধন করা যেতে পারে।

function capsCheck(e,obj){ 
    kc = e.keyCode?e.keyCode:e.which;  
    sk = e.shiftKey?e.shiftKey:((kc == 16)?true:false);  
    if(((kc >= 65 && kc <= 90) && !sk)||((kc >= 97 && kc <= 122) && sk)){
        document.getElementById('#'+obj.id).style.visibility = 'visible';
    } 
    else document.getElementById('#'+obj.id).style.visibility = 'hidden';
}

এবং ফাংশনটি এইভাবে অ্যানকিপ্রেস ইভেন্টের মাধ্যমে ডাকা হয়:

<input type="password" name="txtPassword" onkeypress="capsCheck(event,this);" />
<div id="capsWarningDiv" style="visibility:hidden">Caps Lock is on.</div> 

IE8- ঠিক করার জন্য ধন্যবাদ। এটি আমার পুনরায় সাজানো উত্তরে অন্তর্ভুক্ত করা হয়েছে (নীচে)। যদিও এটি শক্ত।

5

এটি এমন একটি সমাধান যা লেখার সময় অবস্থা যাচাই করা ছাড়াও, প্রতিটি বার Caps Lockকী টিপলে (কিছু সীমাবদ্ধতা সহ) সতর্কতা বার্তাটি টগল করে ।

এছাড়া, অ্যারিজোনা সীমার বাইরে নন-ইংরেজি অক্ষর সমর্থন যেমন স্ট্রিং অক্ষর বিরুদ্ধে পরীক্ষা toUpperCase()এবং toLowerCase()পরিবর্তে চরিত্র সীমার বিরুদ্ধে চেক করুন।

$(function(){
  //Initialize to hide caps-lock-warning
  $('.caps-lock-warning').hide();

  //Sniff for Caps-Lock state
  $("#password").keypress(function(e) {
    var s = String.fromCharCode( e.which );
    if((s.toUpperCase() === s && s.toLowerCase() !== s && !e.shiftKey)||
       (s.toUpperCase() !== s && s.toLowerCase() === s && e.shiftKey)) {
      this.caps = true; // Enables to do something on Caps-Lock keypress
      $(this).next('.caps-lock-warning').show();
    } else if((s.toLowerCase() === s && s.toUpperCase() !== s && !e.shiftKey)||
              (s.toLowerCase() !== s && s.toUpperCase() === s && e.shiftKey)) {
      this.caps = false; // Enables to do something on Caps-Lock keypress
      $(this).next('.caps-lock-warning').hide();
    }//else else do nothing if not a letter we can use to differentiate
  });

  //Toggle warning message on Caps-Lock toggle (with some limitation)
  $(document).keydown(function(e){
    if(e.which==20){ // Caps-Lock keypress
      var pass = document.getElementById("password");
      if(typeof(pass.caps) === 'boolean'){
        //State has been set to a known value by keypress
        pass.caps = !pass.caps;
        $(pass).next('.caps-lock-warning').toggle(pass.caps);
      }
    }
  });

  //Disable on window lost focus (because we loose track of state)
  $(window).blur(function(e){
    // If window is inactive, we have no control on the caps lock toggling
    // so better to re-set state
    var pass = document.getElementById("password");
    if(typeof(pass.caps) === 'boolean'){
      pass.caps = null;
      $(pass).next('.caps-lock-warning').hide();
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="password" id="password" />
<span class="caps-lock-warning" title="Caps lock is on!">CAPS</span>

নোট করুন যে ক্যাপগুলি লক টগলিং পর্যবেক্ষণ কেবল তখনই কার্যকর যখন যদি আমরা Caps Lockকী চাপবার আগে ক্যাপস লকটির অবস্থা জানি । বর্তমান ক্যাপস লক অবস্থাটি capsপাসওয়ার্ড উপাদানটিতে একটি জাভাস্ক্রিপ্ট বৈশিষ্ট্যের সাথে রাখা হয়েছে । ব্যবহারকারী যখন উচ্চর বা নিম্নতর আকারের হতে পারে এমন কোনও চিঠি চাপলে আমাদের প্রথমবার ক্যাপস লক অবস্থার বৈধতা সেট করা হয়। উইন্ডোটি যদি ফোকাস হারিয়ে ফেলে তবে আমরা আর ক্যাপস লক টগলিং পর্যবেক্ষণ করতে পারি না, তাই আমাদের অজানা অবস্থায় পুনরায় সেট করতে হবে।


2
ভাল ধারণা. আপনি যদি ব্যবহারকারীকে কোনও সতর্কতা দেখাতে চলেছেন যে ক্যাপস লক চালু রয়েছে তবে ক্যাপস লকটি অক্ষম হয়ে গেলে অবিলম্বে সেই সতর্কতাটি বন্ধ করে দেওয়া ভাল ধারণা, অন্যথায় আপনি ব্যবহারকারীকে বিভ্রান্ত করতে পারেন।
আজেদী 32

3

সম্প্রতি হ্যাশকোড.কম এ একই প্রশ্ন ছিল এবং আমি এটি মোকাবেলা করতে একটি jQuery প্লাগইন তৈরি করেছি। এটি সংখ্যায় ক্যাপস লক সনাক্তকরণকে সমর্থন করে। (মানক জার্মান কীবোর্ড লেআউটে ক্যাপস লক সংখ্যার উপর প্রভাব ফেলে)।

আপনি এখানে সর্বশেষতম সংস্করণটি চেক করতে পারেন: jquery.capsChecker


3

টুইটার বুটস্ট্র্যাপ সহ jQuery এর জন্য

নিম্নলিখিত অক্ষরগুলির জন্য লক করা ক্যাপগুলি পরীক্ষা করুন:

বড়জোর এজেড বা 'Ä', 'Ö', 'Ü', '!', '' ',' § ',' $ ','% ',' ও ',' / ',' (',') ' , '=', ':', ';', '*', '' '

ছোট হাতের জেড বা 0-9 বা 'ä', 'ö', 'ü', '।', ',', '+', '#'

/* check for CAPS LOCK on all password fields */
$("input[type='password']").keypress(function(e) {
    var kc = e.which; // get keycode

    var isUpperCase = ((kc >= 65 && kc <= 90) || (kc >= 33 && kc <= 34) || (kc >= 36 && kc <= 39) || (kc >= 40 && kc <= 42) || kc == 47 || (kc >= 58 && kc <= 59) || kc == 61 || kc == 63 || kc == 167 || kc == 196 || kc == 214 || kc == 220) ? true : false; // uppercase A-Z or 'Ä', 'Ö', 'Ü', '!', '"', '§', '$', '%', '&', '/', '(', ')', '=', ':', ';'
    var isLowerCase = ((kc >= 97 && kc <= 122) || (kc >= 48 && kc <= 57) || kc == 35 || (kc >= 43 && kc <= 44) || kc == 46 || kc == 228 || kc == 223 || kc == 246 || kc == 252) ? true : false; // lowercase a-Z or 0-9 or 'ä', 'ö', 'ü', '.', ','

    // event.shiftKey does not seem to be normalized by jQuery(?) for IE8-
    var isShift = (e.shiftKey) ? e.shiftKey : ((kc == 16) ? true : false); // shift is pressed

    // uppercase w/out shift or lowercase with shift == caps lock
    if ((isUpperCase && !isShift) || (isLowerCase && isShift)) {
        $(this).next('.form-control-feedback').show().parent().addClass('has-warning has-feedback').next(".capsWarn").show();
    } else {
        $(this).next('.form-control-feedback').hide().parent().removeClass('has-warning has-feedback').next(".capsWarn").hide();
    }
}).after('<span class="glyphicon glyphicon-warning-sign form-control-feedback" style="display:none;"></span>').parent().after("<span class='capsWarn text-danger' style='display:none;'>Is your CAPSLOCK on?</span>");

jsfiddle এ লাইভ ডেমো


3

একটি পরিবর্তনশীল যা ক্যাপস লক অবস্থাটি দেখায়:

let isCapsLockOn = false;

document.addEventListener( 'keydown', function( event ) {
  var caps = event.getModifierState && event.getModifierState( 'CapsLock' );
  if(isCapsLockOn !== caps) isCapsLockOn = caps;
});

document.addEventListener( 'keyup', function( event ) {
  var caps = event.getModifierState && event.getModifierState( 'CapsLock' );
  if(isCapsLockOn !== caps) isCapsLockOn = caps;
});

সমস্ত ব্রাউজারে কাজ করে => canIUse


1
একটি পুরানো প্রশ্নের একটি আপ-টু-ডেট উত্তর দেওয়ার জন্য উত্সাহিত। আপনি "2017 জন্য আপডেট" "(> 2017-) আধুনিক ব্রাউজারে জন্য চেষ্টা এই" একটি শিরোনাম ভালো কিছু বলার অপেক্ষা রাখে না ভালো কিছু যোগ করতে চাইতে পারেন
EON

3

@ ব্যবহারকারী110902 পোস্ট করা এই jQuery- ভিত্তিক উত্তরটি আমার পক্ষে দরকারী। তবে @B_N এর মন্তব্যে উল্লিখিত ত্রুটি রোধ করার জন্য আমি এটির সামান্য উন্নতি করেছি: আপনি শিফট টিপানোর সময় ক্যাপসলক সনাক্ত করতে ব্যর্থ হয়েছে:

$('#example').keypress(function(e) { 
    var s = String.fromCharCode( e.which );
    if (( s.toUpperCase() === s && s.toLowerCase() !== s && !e.shiftKey )
    ||  ( s.toLowerCase() === s && s.toUpperCase() !== s && e.shiftKey )) {
        alert('caps is on');
    }
});

এর মতো এটি শিফট টিপানোর সময়ও কাজ করবে।


2

এই কোডটি কেপস লক সনাক্ত করে যে কোনও ক্ষেত্রেই বা শিফট কী টিপে থাকলে:

$('#password').keypress(function(e) { 
    var s = String.fromCharCode( e.which );
    if ( (s.toUpperCase() === s && !e.shiftKey) || 
             (s.toLowerCase() === s && e.shiftKey) ) {
        alert('caps is on');
    }
});

এটি ফায়ারফক্সে উপরের কেস হিসাবে স্থান এবং ব্যাকস্পেস সনাক্ত করতে পারে।
অ্যাড্রিয়ান রোসকা

2

আমি ক্যাপসলক নামে একটি গ্রন্থাগার লিখেছিলাম যা আপনি এটি করতে চান ঠিক তা করে।

এটি কেবল আপনার ওয়েব পৃষ্ঠায় অন্তর্ভুক্ত করুন:

<script src="https://rawgit.com/aaditmshah/capsLock/master/capsLock.js"></script>

তারপরে এটি ব্যবহার করুন:

alert(capsLock.status);

capsLock.observe(function (status) {
    alert(status);
});

ডেমোটি দেখুন: http://jsfiddle.net/3EXMd/

আপনি ক্যাপস লক কী টিপলে স্থিতি আপডেট হয়। এটি কেবল ক্যাপস লক কীটির সঠিক স্থিতি নির্ধারণের জন্য শিফট কী হ্যাক ব্যবহার করে। প্রাথমিকভাবে স্ট্যাটাসটি হয় false। তাই সাবধান।


এটি সত্যিই উদ্ভাবনী সমাধান। তবে এতে ত্রুটি রয়েছে যে পৃষ্ঠাটি ফোকাস লাভ করার সময় ক্যাপস লক চালু থাকলে "ক্যাপসলক" অবজেক্টটি ভুল অবস্থার (অফ) দিয়ে শুরু হয়।
রিক

প্রকৃতপক্ষে এটি একটি ভুল রাষ্ট্র দিয়ে শুরু হয়। তবে আপনি যখন কোনও কী টিপেন তখন এটি স্বয়ংক্রিয়ভাবে তার অবস্থার সংশোধন করে। পৃষ্ঠাটি ফোকাস করার পরে যদি আপনি এটি সঠিক অবস্থানে সেট করার কোনও উপায় বের করতে পারেন তবে আমি আপনার কোডটি একীভূত করতে পেরে খুশি হব।
অদিত এম শাহ

2

তবুও অন্য একটি সংস্করণ, পরিষ্কার এবং সরল, হস্তান্তরিত ক্যাপসলকটি পরিচালনা করে, এবং এএসআইআই-তে আমার মনে হয় না:

document.onkeypress = function (e)
{
    e = e || window.event;
    if (e.charCode === 0 || e.ctrlKey || document.onkeypress.punctuation.indexOf(e.charCode) >= 0)
        return;
    var s = String.fromCharCode(e.charCode); // or e.keyCode for compatibility, but then have to handle MORE non-character keys
    var s2 = e.shiftKey ? s.toUpperCase() : s.toLowerCase();
    var capsLockOn = (s2 !== s);
    document.getElementById('capslockWarning').style.display = capsLockOn ? '' : 'none';
}
document.onkeypress.punctuation = [33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,91,92,93,94,95,96,123,124,125,126];

সম্পাদনা করুন: ক্যাপস লকঅন সংবেদনটি বিপরীত ছিল, দোহ, স্থির।

সম্পাদনা # 2: এটি আরও কিছু যাচাই করার পরে, আমি দুর্ভাগ্যক্রমে কিছু পরিবর্তন করেছি, কিছুটা আরও বিস্তৃত কোড করেছি, তবে এটি যথাযথভাবে আরও ক্রিয়া পরিচালনা করে।

  • E.CCCode এর পরিবর্তে e.charCode ব্যবহার করা এবং 0 টি মানের জন্য পরীক্ষা করা কোনও নির্দিষ্ট ভাষা বা চরসেটের সাথে নির্দিষ্ট কোনও কোডিং ছাড়াই প্রচুর নন-ক্যারেক্টার কিপ্রেসগুলি এড়িয়ে যায়। আমার বোধগম্যতা থেকে, এটি কিছুটা কম সামঞ্জস্যপূর্ণ, তাই পুরানো, মূল-মূলধারার না, বা মোবাইল ব্রাউজারগুলি এই কোডটি প্রত্যাশা হিসাবে আচরণ করতে পারে না, তবে যাইহোক আমার পরিস্থিতির জন্য এটি মূল্যবান।

  • পরিচিত বিরামচিহ্ন কোডগুলির তালিকার বিরুদ্ধে চেক করা তাদের মিথ্যা নেতিবাচক হিসাবে দেখা থেকে বাধা দেয়, কারণ তারা ক্যাপস লক দ্বারা প্রভাবিত হয় না। এটি ছাড়াই আপনি যখন কোনও বিরামচিহ্ন অক্ষর টাইপ করেন তখন ক্যাপস লক সূচকটি লুকিয়ে যায়। একটি অন্তর্ভুক্ত সেট না করে বাদ দেওয়া সেট নির্দিষ্ট করে, এটি প্রসারিত অক্ষরের সাথে আরও সুসংগত হওয়া উচিত। এটি অদৃশ্যতম, বিশেষ-ক্যাসিস্ট বিট এবং এর কিছু সম্ভাবনা রয়েছে যে অ-পাশ্চাত্য ভাষাগুলিতে সমস্যা হওয়ার জন্য বিভিন্ন পর্যাপ্ত বিরামচিহ্ন এবং বিরামচিহ্ন কোড রয়েছে তবে এটি আবার আইএমও এর পক্ষে মূল্যহীন, কমপক্ষে আমার পরিস্থিতির জন্য।


2

প্রতিক্রিয়া

onKeyPress(event) { 
        let self = this;
        self.setState({
            capsLock: isCapsLockOn(self, event)
        });
    }

    onKeyUp(event) { 
        let self = this;
        let key = event.key;
        if( key === 'Shift') {
            self.shift = false;
        }
    }

    <div>
     <input name={this.props.name} onKeyDown={(e)=>this.onKeyPress(e)} onKeyUp={(e)=>this.onKeyUp(e)} onChange={this.props.onChange}/>
                {this.capsLockAlert()}
</div>

function isCapsLockOn(component, event) {
        let key = event.key;
        let keyCode = event.keyCode;

        component.lastKeyPressed = key;

        if( key === 'Shift') {
            component.shift = true;
        } 

        if (key === 'CapsLock') {
            let newCapsLockState = !component.state.capsLock;
            component.caps = newCapsLockState;
            return newCapsLockState;
        } else {
            if ((component.lastKeyPressed !== 'Shift' && (key === key.toUpperCase() && (keyCode >= 65 && keyCode <= 90)) && !component.shift) || component.caps ) {
                component.caps = true;
                return true;
            } else {
                component.caps = false;
                return false;
            }
        }
    }

1

এটি আমার পক্ষে ভাল কাজ করার পর থেকে @ জোশুয়াহেল্ডুন্ডের উত্তরের ভিত্তিতে।

আমি কোডটিকে একটি ফাংশন তৈরি করেছিলাম যাতে এটি পুনরায় ব্যবহার করা যায়, এবং এটি আমার ক্ষেত্রে এটি শরীরের সাথে যুক্ত করে। আপনি যদি চান তবেই এটি পাসওয়ার্ড ক্ষেত্রের সাথে লিঙ্ক করা যেতে পারে।

<html>
<head>
<script language="javascript" type="text/javascript" >
function checkCapsLock(e, divId) { 
    if(e){
        e = e;
    } else {
        e = window.event;
    }
    var s = String.fromCharCode( e.which );
    if ((s.toUpperCase() === s && s.toLowerCase() !== s && !e.shiftKey)|| //caps is on
      (s.toUpperCase() !== s && s.toLowerCase() === s && e.shiftKey)) {
        $(divId).style.display='block';
    } else if ((s.toLowerCase() === s && s.toUpperCase() !== s && !e.shiftKey)||
      (s.toLowerCase() !== s && s.toUpperCase() === s && e.shiftKey)) { //caps is off
        $(divId).style.display='none';
   } //else upper and lower are both same (i.e. not alpha key - so do not hide message if already on but do not turn on if alpha keys not hit yet)
 }
</script>
<style>    
.errorDiv {
    display: none;
    font-size: 12px;
    color: red;
    word-wrap: break-word;
    text-overflow: clip;
    max-width: 200px;
    font-weight: normal;
}
</style>
</head>
<body  onkeypress="checkCapsLock(event, 'CapsWarn');" >
...
<input name="password" id="password" type="password" autocomplete="off">
<div id="CapsWarn" class="errorDiv">Capslock is ON !</div>
...
</body>
</html>

1

মটি এবং ডিয়েগো ভিয়েরার উপরের প্রতিক্রিয়া হ'ল আমরা কী ব্যবহার করে শেষ করেছি এবং এখন তা গ্রহণযোগ্য উত্তর হওয়া উচিত। তবে আমি এটি লক্ষ্য করার আগে আমি এই ছোট্ট জাভাস্ক্রিপ্ট ফাংশনটি লিখেছি যা চরিত্রের কোডগুলিতে নির্ভর করে না ...

var capsLockIsOnKeyDown = {shiftWasDownDuringLastChar: false,
  capsLockIsOnKeyDown: function(event) {
    var eventWasShiftKeyDown = event.which === 16;
    var capsLockIsOn = false;
    var shifton = false;
    if (event.shiftKey) {
        shifton = event.shiftKey;
    } else if (event.modifiers) {
        shifton = !!(event.modifiers & 4);
    }

    if (event.target.value.length > 0 && !eventWasShiftKeyDown) {
      var lastChar = event.target.value[event.target.value.length-1];
      var isAlpha = /^[a-zA-Z]/.test(lastChar);

      if (isAlpha) {
        if (lastChar.toUpperCase() === lastChar && lastChar.toLowerCase() !== lastChar
          && !event.shiftKey && !capsLockIsOnKeyDown.shiftWasDownDuringLastChar) {
          capsLockIsOn =  true;
        }
      }
    }
    capsLockIsOnKeyDown.shiftWasDownDuringLastChar = shifton;
    return capsLockIsOn;
  }
}

তারপরে একে একে ইভেন্ট হ্যান্ডলারে কল করুন capsLockIsOnKeyDown.capsLockIsOnKeyDown(event)

তবে আবার আমরা কেবল @ মট্টি এবং @ ডিগো ভিয়িরার প্রতিক্রিয়া ব্যবহার করে শেষ করেছি


0

নীচের এই কোডটিতে ক্যাপস লক হয়ে গেলে এবং তারা শিফটটি ব্যবহার করে কী টিপলে এটি সতর্কতা দেখাবে।

যদি আমরা মিথ্যা প্রত্যাবর্তন করি; তাহলে বর্তমান চর পাঠ্য পৃষ্ঠায় যুক্ত হবে না।

$('#password').keypress(function(e) { 
    // e.keyCode is not work in FF, SO, it will
    // automatically get the value of e.which.  
    var s = String.fromCharCode( e.keyCode || e.which );
    if ( s.toUpperCase() === s && s.toLowerCase() !== s && !e.shiftKey ) {
            alert('caps is on');
            return false;
    }
else  if ( s.toUpperCase() !== s) {
            alert('caps is on and Shiftkey pressed');
            return false;
    }
});

কেবল ক্যাপস লক চালু থাকলেই কাজ করে। যদি ক্যাপস লকটি বন্ধ থাকে তবে এটি এখনও প্রতিবেদন করে যে ক্যাপস লক চালু রয়েছে তবে শিফট কী টিপানো রয়েছে (শিফট কী সহ উভয়ই আসলে চাপছেন বা না)।
ভীতি

ঠিক আছে দুঃখিত @Awe সম্পর্কে
নাগা হরিশ এম

0

সহজে বোঝার জন্য এটিকে সহজ কোড ব্যবহার করে দেখুন

এই লিপি

 <script language="Javascript">
function capLock(e){
 kc = e.keyCode?e.keyCode:e.which;
 sk = e.shiftKey?e.shiftKey:((kc == 16)?true:false);
 if(((kc >= 65 && kc <= 90) && !sk)||((kc >= 97 && kc <= 122) && sk))
  document.getElementById('divMayus').style.visibility = 'visible';
 else
   document.getElementById('divMayus').style.visibility = 'hidden';
}
</script>

এবং এইচটিএমএল

<input type="password" name="txtPassword" onkeypress="capLock(event)" />
 <div id="divMayus" style="visibility:hidden">Caps Lock is on.</div> 

0

এই কোড ব্যবহার করার চেষ্টা করুন।

$('selectorOnTheInputTextBox').keypress(function (e) {
        var charCode = e.target.value.charCodeAt(e.target.value.length - 1)
        var capsOn = 
            e.keyCode && 
            !e.shiftKey &&
            !e.ctrlKey &&
            charCode >= 65 && 
            charCode <= 90;

            if (capsOn) 
               //action if true
            else
               //action if false
});

শুভকামনা :)



0

এই পৃষ্ঠায় সমস্ত ভাল ধারণাগুলি দিয়ে তৈরি jquery ui ব্যবহার করে এখানে একটি কাস্টম জ্যাকুয়েরি প্লাগইন রয়েছে এবং টুলটিপ উইজেটটি ব্যবহার করে। ক্যাপস লক বার্তাটি স্বয়ংক্রিয়ভাবে সমস্ত পাসওয়ার্ড বাক্স প্রয়োগ করা হয় এবং আপনার বর্তমান এইচটিএমএলটিতে কোনও পরিবর্তন প্রয়োজন নেই।

কোডে কাস্টম প্লাগ ...

(function ($) {
    $.fn.capsLockAlert = function () {
        return this.each(function () {
            var capsLockOn = false;
            var t = $(this);
            var updateStatus = function () {
                if (capsLockOn) {
                    t.tooltip('open');
                } else {
                    t.tooltip('close');
                }
            }
            t.tooltip({
                items: "input",
                position: { my: "left top", at: "left bottom+10" },
                open: function (event, ui) {
                    ui.tooltip.css({ "min-width": "100px", "white-space": "nowrap" }).addClass('ui-state-error');
                    if (!capsLockOn) t.tooltip('close');
                },
                content: function () {
                    return $('<p style="white-space: nowrap;"/>')
                        .append($('<span class="ui-icon ui-icon-alert" style="display: inline-block; margin-right: 5px; vertical-align: text-top;" />'))
                        .append('Caps Lock On');
                }
            })
            .off("mouseover mouseout")
            .keydown(function (e) {
                if (e.keyCode !== 20) return;
                capsLockOn = !capsLockOn;
                updateStatus();
            })
            .keypress(function (e) {
                var kc = e.which; //get keycode

                var isUp = (kc >= 65 && kc <= 90) ? true : false; // uppercase
                var isLow = (kc >= 97 && kc <= 122) ? true : false; // lowercase
                if (!isUp && !isLow) return; //This isn't a character effected by caps lock

                // event.shiftKey does not seem to be normalized by jQuery(?) for IE8-
                var isShift = (e.shiftKey) ? e.shiftKey : ((kc === 16) ? true : false); // shift is pressed

                // uppercase w/out shift or lowercase with shift == caps lock
                if ((isUp && !isShift) || (isLow && isShift)) {
                    capsLockOn = true;
                } else {
                    capsLockOn = false;
                }
                updateStatus();
            });
        });
    };
})(jQuery);

সমস্ত পাসওয়ার্ড উপাদান প্রয়োগ করুন ...

$(function () {
    $(":password").capsLockAlert();
});

0

জাভাস্ক্রিপ্ট কোড

<script type="text/javascript">
   function isCapLockOn(e){
   kc = e.keyCode?e.keyCode:e.which;
   sk = e.shiftKey?e.shiftKey:((kc == 16)?true:false);
   if(((kc >= 65 && kc <= 90) && !sk)||((kc >= 97 && kc <= 122) && sk))
       document.getElementById('alert').style.visibility = 'visible';
   else
       document.getElementById('alert').style.visibility = 'hidden';
   }
</script>

আমাদের এখন এইচটিএমএল ব্যবহার করে এই স্ক্রিপ্টটি যুক্ত করতে হবে

<input type="password" name="txtPassword" onkeypress="isCapLockOn(event)" />
<div id="alert" style="visibility:hidden">Caps Lock is on.</div> 

0

আমার জানা দেরি হয়ে গেছে তবে, এটি অন্য কারও সহায়ক হতে পারে।

সুতরাং এখানে আমার সহজ সমাধান (তুর্কি অক্ষরের সাথে);

function (s,e)
{
    var key = e.htmlEvent.key;

    var upperCases = 'ABCÇDEFGĞHIİJKLMNOÖPRSŞTUÜVYZXWQ';
    var lowerCases = 'abcçdefgğhıijklmnoöprsştuüvyzxwq';
    var digits = '0123456789';

    if (upperCases.includes(key))
    {
        document.getElementById('spanLetterCase').innerText = '[A]';
    }

    else if (lowerCases.includes(key))
    {
        document.getElementById('spanLetterCase').innerText = '[a]';
    }

    else if (digits.includes(key))
    {
        document.getElementById('spanLetterCase').innerText = '[1]';
    }

    else
    {
        document.getElementById('spanLetterCase').innerText = '';
    }
}

0

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

let capsIsOn=false;
let capsChecked=false;

let capsCheck=(e)=>{
    let letter=e.key;
    if(letter.length===1 && letter.match(/[A-Za-z]/)){
        if(letter!==letter.toLowerCase()){
          capsIsOn=true;
          console.log('caps is on');
        }else{
          console.log('caps is off');
        }
        capsChecked=true;
        window.removeEventListener("keyup",capsCheck);
    }else{
      console.log("not a letter, not capsCheck was performed");
    }

}

window.addEventListener("keyup",capsCheck);

window.addEventListener("keyup",(e)=>{
  if(capsChecked && e.keyCode===20){
    capsIsOn=!capsIsOn;
  }
});


-1

আপনি যখন টাইপ করেন, ক্যাপলক চালু থাকলে তা স্বয়ংক্রিয়ভাবে বর্তমান চরটিকে ছোট হাতের মধ্যে রূপান্তর করতে পারে। এইভাবে ক্যাপলকগুলি চালু থাকলেও এটি বর্তমান পৃষ্ঠায় যেমন হয় তেমন আচরণ করবে না। আপনার ব্যবহারকারীদের অবহিত করার জন্য আপনি একটি পাঠ্য প্রদর্শন করতে পারেন যাতে ক্যাপলকগুলি চালু রয়েছে তবে ফর্মের এন্ট্রি রূপান্তরিত রয়েছে।


হ্যাঁ, তবে তারপরেও আপনাকে ক্যাপস লকটি সনাক্ত করতে হবে। এছাড়াও, এর অর্থ হ'ল আপনি পাসওয়ার্ডগুলিতে বড় হাতছাড়া করছেন, যা উপ-অনুকূল।
ডেভ লিপম্যান

ক্যাপস লক চালু আছে কিনা তা সনাক্ত করতে, আপনার যাচাই করা চরটির ছোট হাতের সংস্করণটি এটি থেকে আলাদা কিনা তা পরীক্ষা করে দেখতে হবে - এটি যদি> ক্যাপস লক হয়, তবে «সতর্কতা: আপনি ক্যাপস লকটি ব্যবহার করছেন তবে আমাদের সিস্টেমটি রূপান্তর করছে লোয়ার কেস », আমি অনুমান করি জাভাস্ক্রিপ্টটি সর্বোপরি ক্যাপস লক সনাক্তকরণের জন্য নয় (চেকিং ক্যাপস লকটির একটি সিস্টেম অ্যাক্সেস প্রয়োজন) আপনাকে অবশ্যই তার প্রয়োজনের সর্বোত্তম উপায়টি খুঁজে বের করতে হবে
ফ্রেডেরিক.এল

-1

ক্যাপস-লক সনাক্তকরণের জন্য আরও সহজ সমাধান রয়েছে:

function isCapsLockOn(event) {
    var s = String.fromCharCode(event.which);
    if (s.toUpperCase() === s && s.toLowerCase() !== s && !event.shiftKey) {
        return true;
    }
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.