Попытка написать ввод JavaScript для обнаружения Capslock и отображения предупреждения/сообщения об ошибке, когда клавиш ⇐ CSS

[Anonymous]

HTML:

Detect Capslock //this is the input area Email //this is the error message Oops, your email cannot contain any Uppercase!

This is the HTML code, I am not sure if I should have the inline CSS in the HTML code and still repeat it in the JavaScript code

JavaScript:

const input = document.getElementById("input"); const errMsg = document.getElementById("errormessage"); input.addEventListener("keyup", function(event) { if (event.getModifierState("Capslock")) { errMsg.style.display = "block"; //this line should show the error message when the capslock key is on. errMsg.style.color = "red"; //this line shows the color the error message should be in } else { errMsg.style.display = "none"; //this shows how it should be when the capslock isn't on errMsg.style.color = "none"; } }); I have an HTML form with an email input field. I'm trying to show an error message in red when the CapsLock key is on, indicating that the email should not contain any uppercase letters. The error message should be hidden when CapsLock is off. The issue is that the error message isn't displaying when CapsLock is on. Am I correctly using the event listener to detect CapsLock status, and should I duplicate the CSS in JavaScript for styling?


Источник: https://stackoverflow.com/questions/780 ... rning-erro