JavaScript的keyListener

Question

我想添加一個keylistener到我的輸入字段，但我不能讓它工作。我的輸入類型是text和id= "code"。這裏是我的嘗試：

document.querySelector('code').addEventListener('keypress', function (e) { 
    var key = e.which || e.keyCode; 
    window.alert(key); 
}); 

和

document.getElementById('code').addEventListener("keydown", dealWithKeyboard, false); 

function dealWithKeyboard(e) { 
    if (window.event) { // IE 
     keynum = e.keyCode; 
    } else if (e.which) { // Netscape/Firefox/Opera 
     keynum = e.which; 
    } 
    window.alert(keynum); 
} 

和

document.getElementById('code').onkeyup = function(e) { 
    if (window.event) { // IE 
     keynum = e.keyCode; 
    } else if (e.which) { // Netscape/Firefox/Opera 
     keynum = e.which; 
    } 
    window.alert(keynum); 
} 

但沒有一個似乎工作

Answer 1

你是不是使用了正確的選擇與document.querySelector()。在document.querySelector('#code')之前，一個id值必須在#之前。

document.querySelector('#code').addEventListener('keypress', function (e) { 
    var key = e.which || e.keyCode; 
    console.log(key); 
}); 

工作片斷：

document.querySelector('#code').addEventListener('keypress', function (e) { 
 
    var key = e.which || e.keyCode; 
 
    log(key); 
 
}); 
 

 
// show output 
 
function log(x) { 
 
    var div = document.createElement("div"); 
 
    div.innerHTML = x; 
 
    document.body.appendChild(div); 
 
}

Type some characters in the Input field here: 
 
<input id="code">

實施得當，你的document.getElementById('code')例子應該工作。

---

如果仍然不能正常工作，然後檢查兩兩件事：

1. 確保您正在執行這個腳本後的DOM的相關部分已經被加載。有幾種方法可以確保這一點，但最簡單的方法就是將<script>標籤放在它所指的HTML之後。

2. 確保沒有腳本錯誤阻止您的代碼執行。您可以檢查調試控制檯以檢查錯誤。

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.