如何使用javascript收聽頁面中的所有用戶輸入？

Question

如何使用javascript收聽頁面中的所有用戶輸入？ 至少所有鍵盤和鼠標輸入。 有活動嗎？ 多個事件？

Answer 1

代碼筆

 const inputs = document.querySelectorAll('input') inputs.forEach(el => { el.addEventListener('input', function (ev) { const { target } = ev const { type, checked, value } = target if(type === 'text') { console.log(type, value) } if(['checkbox', 'radio'].includes(type)) { console.log(type, checked, value) } }) })

 <input type="text" value=""> <label> <input type="checkbox" checked value="checkbox"> Checkbox </label> <label> <input type="radio" name="radio" value="1"> Radio1 </label> <label> <input type="radio" name="radio" value="2"> Radio2 </label>

Answer 2

根據指定，您可以在文檔中找到事件列表

如果您想捕獲網頁上的每個按鍵並獲取關鍵代碼，您可以添加此事件，例如：

window.addEventListener("keydown", (event) => {
   console.log(event.keyCode)
});

或者如果你想捕捉鼠標位置：

onmousemove = event => {
    console.log("mouse location:", event.clientX, event.clientY);
}
window.addEventListener("mousemove", onmousemove);