При имитации события нажатия клавиши не обнаруживается блокировка заглавных букв из Document Ready без элемента ввода - PullRequest
Новая
       21

При имитации события нажатия клавиши не обнаруживается блокировка заглавных букв из Document Ready без элемента ввода

0 голосов
/ 29 октября 2018

Пожалуйста, внимательно прочитайте, это не дубликат, который я прочитал и jsfiddled все, что связано с stackoverflow.

Некоторые из них используют поле ввода в контексте паролей (все требуют нажатия на что-то или нажатия клавиши) но мое приложение не нуждается в поле ввода или паролях.Я хочу, чтобы пользователь мог обновлять страницу и не нажимать что-либо или где-либо, чтобы увидеть состояние блокировки шапки, если это возможно.

У меня есть рабочий код, который имитирует нажатие клавиши, чтобы определить,Caps Lock включен или выключен.Код работает отлично, но требует, чтобы вы нажимали любую клавишу на клавиатуре, чтобы начать движение.Я хотел бы, чтобы обнаружение происходило сразу в функции готовности документа.Я протестировал код во всех браузерах Windows 10 и во всех браузерах Mac Mojave, и он работает одинаково во всех.Я перепробовал все, что только мог придумать, и мне кажется, что это должно быть что-то простое.

Есть ли способ программно отправить этот дополнительный ход клавиш при обновлении страницы?

Шаги дляВоссоздайте проблему:

  1. Запустите скрипку
  2. Несколько раз нажмите Caps Lock (ничего не происходит)
  3. Нажмите любую клавишу на клавиатуре (то есть «a»)и событие запускается с состоянием caps lock.
  4. Нажмите несколько раз caps lock, и вы увидите, что шаг 3 выше исправил его.

Вот мой код HTML 

<h3>Detect Caps Lock</h3>
<p>Set focus to body element and Press the "Caps Lock" key</p>
<p id="text">WARNING! Caps lock is ON.</p>

CSS 

#text {
  display: none;
  color: red
}

JS 

$(document).ready(function() {
  var text = document.getElementById("text");

  function displayCapsLockStatus(event) {
    if (event.getModifierState("CapsLock")) {
      text.style.display = "inline-block";
    } else {
      text.style.display = "none"
    }
  }
  document.addEventListener("keydown", function(event) {
    console.log(event.which);
    displayCapsLockStatus(event); //Needed for Windows & Mac OS X
  });
  document.addEventListener("keyup", function(event) {
    displayCapsLockStatus(event); //Needed for Mac OS X Only
  });
  setTimeout(function() {
  $(window).click();    
  $(window).focus();    
    $(window).trigger({
      type: 'keydown',
      which: 'a',
      keyCode: 65
    });
  }, 1000);

});

Вот моя скрипка: https://jsfiddle.net/Larry_Robertson/u0fc4krb/421/

...