Open dbates-wk opened 5 years ago
<!DOCTYPE html> <html> <body> <input type="checkbox"> <pre id="console"></pre> <script> let checkbox = document.querySelector("input");
function logKeyEvent(event) { logMessage(${event.type} key: ${event.key} keyCode: ${event.keyCode}); }
${event.type} key: ${event.key} keyCode: ${event.keyCode}
function logEvent(event) { logMessage(${event.type}); }
${event.type}
function logMessage(message) { document.getElementById("console").appendChild(document.createTextNode(message + "\n")); }
function handleFocus() { checkbox.addEventListener("keydown", logKeyEvent); checkbox.addEventListener("keypress", logKeyEvent); checkbox.addEventListener("keyup", logKeyEvent); checkbox.addEventListener("change", logEvent); checkbox.addEventListener("click", logEvent); checkbox.addEventListener("DOMActivate", logEvent); }
checkbox.addEventListener("focus", handleFocus, { once: true });
function logKeyEvent(event) { logMessage(
${event.type} key: ${event.key} keyCode: ${event.keyCode}
); }function logEvent(event) { logMessage(
${event.type}
); }function logMessage(message) { document.getElementById("console").appendChild(document.createTextNode(message + "\n")); }
function handleFocus() { checkbox.addEventListener("keydown", logKeyEvent); checkbox.addEventListener("keypress", logKeyEvent); checkbox.addEventListener("keyup", logKeyEvent); checkbox.addEventListener("change", logEvent); checkbox.addEventListener("click", logEvent); checkbox.addEventListener("DOMActivate", logEvent); }
checkbox.addEventListener("focus", handleFocus, { once: true });