كيف يمكنك معرفة ما إذا كان مفتاح caps lock قيد التشغيل باستخدام JavaScript؟

Question

كيف يمكنك معرفة ما إذا كان مفتاح caps lock قيد التشغيل باستخدام JavaScript؟

تحذير واحد رغم ذلك:لقد بحثت في Google وكان أفضل حل يمكن أن أجده هو إرفاق ملف onkeypress حدث لكل إدخال، ثم تحقق في كل مرة مما إذا كان الحرف الذي تم الضغط عليه كبيرًا، وإذا كان كذلك، فتحقق مما إذا كان مفتاح Shift قد تم الضغط عليه أيضًا.إذا لم يكن كذلك، فيجب أن يكون مفتاح caps lock قيد التشغيل.هذا يبدو قذرًا حقًا وفقط ... مسرف - بالتأكيد هناك طريقة أفضل من هذه؟

Answer 1

وجدت هذه مثيرة للاهتمام .... يمكنك محاولة إعطائها ..

function isCapslock(e){

    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;

}

لشخصيات دولية، يمكن إضافة الاختيار إضافية لمفاتيح التالية حسب الحاجة. لديك للحصول على مجموعة الرمز الرئيسي للأحرف كنت مهتما، قد يكون باستخدام مجموعة keymapping التي ستعقد كل استخدام مفاتيح حالة صالحة كنت معالجة ...

والأحرف الكبيرة A-Z أو ''، 'Ö'، 'Ü'، أحرف صغيرة و-Z أو 0-9 أو ''، 'ö'، 'ü'

ومفاتيح المذكورة أعلاه هي مجرد تمثيل العينة.

Answer 2

في مسج،

$('#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.

Answer 3

يمكنك استخدام أ KeyboardEvent لاكتشاف العديد من المفاتيح بما في ذلك caps lock في أحدث المتصفحات.

ال getModifierState وظيفة سوف توفر الدولة ل:

• بديل
• الرسم البياني البديل
• Caps lock
• يتحكم
• الجبهة الوطنية (أندرويد)
• ميتا
• نوملوك
• نظام التشغيل (ويندوز ولينكس)
• ScrollLock
• يحول

هذا التجريبي يعمل في جميع المتصفحات الرئيسية بما في ذلك الهاتف المحمول (هل بإمكاني استخدم).

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

Answer 4

ويمكنك الكشف عن قبعات قفل باستخدام "هو حرف كبير وأي تحول الضغط" باستخدام التقاط بضغطة على الوثيقة. ولكن بعد ذلك كنت أفضل أن تكون على يقين من أن أي معالج بضغطة أخرى للملوثات العضوية الثابتة فقاعة الحدث قبل أن يحصل على معالج على الوثيقة.

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() للالتفاف على ذلك).

Answer 5

والعديد من الإجابات القائمة سوف تحقق للقبعات قفل على عندما لا يتم الضغط التحول ولكن لن الاختيار لأنه إذا ضغطت التحول والحصول على صغيرة، أو سوف تحقق لذلك ولكن لن الاختيار أيضا للقبعات قفل يجري خارج، أو سوف تحقق لذلك ولكن سوف تنظر مفاتيح غير ألفا باسم 'قبالة'. هنا هو الحل مسج تكييفها التي سوف تظهر تحذيرا إذا تم الضغط على مفتاح ألفا مع قبعات (تحول أو لا تحول)، سيتم إيقاف التحذير إذا تم الضغط على مفتاح ألفا دون قبعات، ولكن لن يتحول التحذير أو إيقاف تشغيلها عندما يتم الضغط أرقام أو مفاتيح أخرى.

$("#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)
  });

Answer 6

في مسج. ويغطي هذا المبلغ التعامل مع الحدث في فايرفوكس وسوف تحقق كل من الأحرف الكبيرة والصغيرة غير متوقعة. هذا يفترض مسبقا <input id="password" type="password" name="whatever"/>element وعنصر منفصل مع "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();
    }
});

Answer 7

والأجوبة العليا هنا لم يعمل بالنسبة لي لعدة أسباب (رمز علق الامم المتحدة مع وصلة القتلى وحل غير مكتملة). لذلك قضيت بضع ساعات في محاولة من الجميع والحصول على أفضل ما يمكن: وهنا الألغام، بما في ذلك مسج وغير مسج

مسج

لاحظ أن مسج تطبيع الكائن الحدث حتى بعض الشيكات مفقودة. لقد ضاقت أيضا على جميع حقول كلمة المرور (منذ هذا هو السبب الأكبر في حاجة إلى ذلك)، وأضاف رسالة تحذير. وقد تم اختبار هذا في كروم، وموزيلا وأوبرا، وIE6-8. مستقرة وأدرك جميع الدول كابسلوك باستثناء عندما يتم الضغط على أرقام أو مسافات.

/* 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>");

بدون مسج

وتفتقر بعض أخرى مسج-أقل الحلول fallbacks IE. Zappa مصححة ذلك.

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
    }

}

---

ملحوظة: تحقق من الحلول منBorgar،Joe Liversedge، وZappa، والمساعد وضعتهاPavel Azanov، التي لم أحاول بل هو فكرة جيدة. اذا كان هناك من يعرف وسيلة لتوسيع نطاق أبعد من A-زا زي، يرجى تحرير بعيدا. أيضا، لا تعمل الإصدارات مسج في هذه المسألة كما مكررة، ولهذا السبب أنا نشر على حد سواء هنا.

Answer 8

وأنا أعلم أن هذا هو موضوع قديم ولكن أعتقد أنني سوف تغذي مرة أخرى في حال يساعد الآخرين. أي من الإجابات على السؤال يبدو للعمل في IE8. لم ومع ذلك تجد هذا الرمز الذي يعمل في IE8. (طعاما اختبار أي شيء أقل من IE8 بعد). هذا يمكن تعديلها بسهولة لمسج إذا لزم الأمر.

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';
}

ويتم استدعاء الدالة من خلال هذا الحدث onkeypress مثل هذا:

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

Answer 9

وهذا هو الحل الذي، بالإضافة إلى فحص حالة عند الكتابة، أيضا تبديل رسالة تحذير في كل مرة قبعات الضغط قفل مفتاح (مع بعض القيود).

وكما يدعم الرسائل غير الإنجليزية خارج نطاق A-Z، لأنه يتحقق الطابع سلسلة ضد 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 الملكية جافا سكريبت على عنصر كلمة المرور. تم تعيين هذه هي المرة الأولى لدينا المصادقة على قبعات قفل الدولة عندما يضغط المستخدم على الرسالة التي يمكن أن تكون حالة العلوي أو السفلي. إذا فقد النافذة التركيز، لم يعد بإمكاننا مراقبة قبعات قفل تبديل، لذلك نحن بحاجة إلى إعادة تعيين إلى حالة غير معروفة.

Answer 10

ونحن نستخدم getModifierState للتحقق من قبعات قفل، انها فقط عضوا في الماوس أو لوحة المفاتيح حدث ذلك لا يمكننا استخدام onfocus. وهما أكثر الطرق شيوعا التي سوف تكسب حقل كلمة المرور التركيز هو بنقرة أو علامة تبويب. نحن نستخدم onclick للتحقق من النقر بالماوس داخل المدخلات، ونستخدم onkeyup للكشف عن علامة تبويب من حقل الإدخال السابقة. إذا حقل كلمة المرور هو الحقل الوحيد في صفحة وهو الذي يركز على السيارات ثم لن يحدث هذا الحدث حتى يتم تحرير المفتاح الأول، والتي على ما يرام ولكن ليست مثالية، وتريد حقا قبعات قفل نصائح أداة لعرضه مرة واحدة المكاسب حقل كلمة المرور التركيز، ولكن بالنسبة لمعظم الحالات هذا الحل يعمل مثل السحر.

وHTML

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

وJS

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

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

Answer 11

ومؤخرا كان هناك <لأ href = "https://ru.stackoverflow.com/questions/179050/javascript-٪D0٪B2٪D0٪BA٪D0٪BB٪D1٪8E٪D1٪87٪D0 ٪ B5٪ D0٪ BD-٪ D0٪ BB٪ D0٪ B8-قبعات-lock-٪ D0٪ B8٪ D0٪ BB٪ D0٪ B8-٪ D0٪ BD٪ D0٪ B5٪ D1٪ 82-٪ D0٪ BD ٪ D0٪ B0-٪ D1٪ 81٪ D0٪ B0٪ D0٪ B9٪ D1٪ 82٪ D0٪ B5 "> على غرار مسألة على hashcode.com، وأنا خلقت المساعد مسج للتعامل معها. كما أنها تدعم الاعتراف قبعات قفل على الأرقام. (على لوحة المفاتيح القياسية الألمانية قبعات تخطيط قفل له تأثير على أرقام).

ويمكنك التحقق من الإصدار الأخير هنا: jquery.capsChecker

Answer 12

لـ jQuery مع twitter bootstrap

تحقق من الأحرف الكبيرة المقفلة للأحرف التالية:

الأحرف الكبيرة من A إلى Z أو 'Ä'، 'Ö'، 'Ü'، '!'، '''، '§'، '$'، '%'، '&'، '/'، '('، ')' ، '='، ':'، '؛'، '*'، '''

أحرف صغيرة a-Z أو 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

Answer 13

ومتغير يظهر قبعات دولة قفل:

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

Answer 14

ويكشف هذا الرمز قبعات قفل بغض النظر عن القضية أو إذا تم الضغط على مفتاح التحول:

$('#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');
    }
});

Answer 15

وكتبت مكتبة دعا CAPSLOCK الذي يفعل بالضبط ما تريد أن تفعله.

وتشمل فقط على صفحات الويب الخاصة بك:

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

وثم استخدامها على النحو التالي:

alert(capsLock.status);

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

وانظر التجريبي: http://jsfiddle.net/3EXMd/

ويتم تحديث المعلومات عند الضغط على مفتاح Caps Lock. ويستخدم فقط على مفتاح Shift الإختراق لتحديد الوضع الصحيح للمفتاح Caps Lock. في البداية تم false الحالة. فالحذر الحذر.

Answer 16

هناك إصدار آخر، واضح وبسيط، يتعامل مع capsLock المتغير، وليس مقيدًا بـ ascii على ما أعتقد:

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];

يحرر: تم عكس إحساس capsLockOn، تم إصلاحه.

التعديل رقم 2: بعد التحقق من ذلك أكثر، قمت بإجراء بعض التغييرات، كود أكثر تفصيلاً قليلاً لسوء الحظ، لكنه يتعامل مع المزيد من الإجراءات بشكل مناسب.

• يؤدي استخدام e.charCode بدلاً من e.keyCode والتحقق من القيم 0 إلى تخطي الكثير من ضغطات المفاتيح التي لا تحتوي على أحرف، دون الحاجة إلى ترميز أي شيء محدد بلغة معينة أو مجموعة أحرف معينة.من وجهة نظري، فهو أقل توافقًا إلى حد ما، لذا قد لا تتصرف المتصفحات الأقدم أو غير السائدة أو متصفحات الهاتف المحمول كما يتوقع هذا الرمز، ولكن الأمر يستحق ذلك، بالنسبة لموقفي على أي حال.

• يؤدي التحقق من قائمة رموز الترقيم المعروفة إلى منع اعتبارها سلبية كاذبة، نظرًا لأنها لا تتأثر بمفتاح caps lock.وبدون ذلك، يصبح مؤشر caps lock مخفيًا عند كتابة أي من أحرف الترقيم تلك.من خلال تحديد مجموعة مستبعدة، بدلاً من مجموعة مضمنة، يجب أن تكون أكثر توافقاً مع الأحرف الموسعة.هذا هو الجزء الأبشع والأكثر خصوصية، وهناك احتمال أن اللغات غير الغربية لديها علامات ترقيم و/أو رموز علامات ترقيم مختلفة بما يكفي لتكون مشكلة، ولكن مرة أخرى، الأمر يستحق ذلك IMO، على الأقل بالنسبة لموقفي.

Answer 17

تتفاعل

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;
            }
        }
    }

Answer 18

هذه الإجابة استنادا مسج- والمرسلة بواسطة @ user110902 كانت مفيدة بالنسبة لي. ومع ذلك، وأنا تحسينه قليلا لمنع الخلل المشار إليها في تعليقB_N الصورة: فشلت كشف كابسلوك أثناء الضغط على Shift:

$('#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');
    }
});

ومثل هذه، وأنها ستعمل حتى أثناء الضغط على Shift.

Answer 19

وبناء على إجابة لjoshuahedlund لأنه يعمل بشكل جيد بالنسبة لي.

ولقد تقدمت رمز وظيفة بحيث يمكن إعادة استخدامها، وربط بينه وبين الجسم في حالتي. ويمكن ربط حقل كلمة المرور إلا إذا كنت تفضل ذلك.

<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>

Answer 20

Mottie و<لأ href = "https://stackoverflow.com/users/1086469/diego-vieira" > دييغو فييرا <لأ href = "https://stackoverflow.com/questions/348792/how-do-you-tell-if-caps-lock-is-on-using-javascript/34277417#34277417" > استجابة أعلاه هو ما انتهى بنا المطاف باستخدام ويجب أن يكون الجواب المقبول الآن. ومع ذلك، قبل لقد لاحظت ذلك، وأنا كتبت هذا وظيفة جافا سكريبت الصغيرة التي لا تعتمد على رموز الأحرف ...

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)

ولكن مرة أخرى، لقد انتهى الأمر مجرد استخدام استجابةMottie الصورة وDiego فييرا الصورة

Answer 21

في هذا الرمز أدناه سوف تكون في حالة تأهب تظهر عند قفل قبعات على وهم اضغط مفتاح باستخدام التحول.

وإذا عدنا كاذبة. ثم سوف شار الحالي ليس إلحاق إلى الصفحة النص.

$('#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;
    }
});

Answer 22

ومحاولة ذلك رمز بسيط في السهل أن نفهم

وهذا هو سيناريو

 <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> 

Answer 23

ومحاولة استخدام هذا الرمز.

$('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
});

وحظا سعيدا:)

Answer 24

هل يمكن استخدام <لأ href = "https://www.google.ro/url؟sa=t&rct=j&q=&esrc=s&source=web&cd=3&cad=rja&uact=8&ved=0CC4QFjAC&url=http٪3A٪2F٪2Fcode .stephenmorley.org٪ 2Fjavascript٪ 2Fdetecting رأس قبعات قفل مفتاح٪ 2F & EI = nDQyVLzhOYmWavPJgMgG وكيل الأمين العام = AFQjCNH5CGRbar1ueG0wYQ5kL0fPLxlzLA وsig2 = FBTr8S2eXqMgMi9BR45tAw وأعلى جودة بأفضل سعر = bv.76802529، d.d2s "يختلط =" نوفولو "> هذا البرنامج النصي . يجب أن تعمل بشكل جيد على ويندوز حتى لو تم الضغط على مفتاح Shift لكنها لن تعمل على نظام التشغيل Mac OS إذا كان الأمر كذلك.

Answer 25

وهنا هو البرنامج المساعد مسج مخصص، وذلك باستخدام واجهة المستخدم مسج، تتكون من جميع الأفكار الجيدة في هذه الصفحة وروافع القطعة تلميح الأدوات. وقبعات قفل الرسالة السيارات تطبق كافة مربعات كلمة المرور و لا يتطلب أي تغييرات على أتش تي أم أل الحالي.

والمكونات مخصص في التعليمات البرمجية ...

(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();
});

Answer 26

كود جافا سكريبت

<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>

نحتاج الآن إلى ربط هذا البرنامج النصي باستخدام HTML

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

Answer 27

وفوات وأنا أعلم، ولكن هذا يمكن أن يكون شخص متعاون آخر.

وحتى هنا هو الحل simpliest لبلدي (مع حرف التركية)؛

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 = '';
    }
}

Answer 28

وهكذا وجدت هذه الصفحة ولم أكن أحب الحلول وجدت لذلك أنا أحسب من أصل واحد، وأنا تقديم ما يصل الى كل واحد منكم. بالنسبة لي، لا يهم إلا إذا كان قبعات قفل على إذا أنا كتابة الحروف. حل هذا الرمز مشكلة بالنسبة لي. لها سريعة وسهلة ويعطيك متغير capsIsOn مرجع كلما كنت في حاجة إليها.

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;
  }
});

Answer 29

عند الكتابة، إذا caplock هو، فإنه يمكن تحويل تلقائيا شار الحالي إلى أحرف صغيرة. وبهذه الطريقة حتى لو caplocks في وضع التشغيل، فإنه لن يتصرف وكأنه هو في الصفحة الحالية. لإعلام المستخدمين هل يمكن عرض النص قائلا ان caplocks في وضع التشغيل، ولكن أن يتم تحويل الإدخالات النموذج.

Answer 30

وهناك حل أبسط من ذلك بكثير للكشف عن قبعات قفل:

function isCapsLockOn(event) {
    var s = String.fromCharCode(event.which);
    if (s.toUpperCase() === s && s.toLowerCase() !== s && !event.shiftKey) {
        return true;
    }
}