Tam bir Javascript ile tarayıcılar arası uyumlu bir şekilde hangi karakter tuşuna basıldığını öğrenmek istiyorum.
event.key
doğrudan size preslenmiş karakteri verecektir
Tam bir Javascript ile tarayıcılar arası uyumlu bir şekilde hangi karakter tuşuna basıldığını öğrenmek istiyorum.
event.key
doğrudan size preslenmiş karakteri verecektir
Yanıtlar:
JavaScript'i "Temizle":
<script type="text/javascript">
function myKeyPress(e){
var keynum;
if(window.event) { // IE
keynum = e.keyCode;
} else if(e.which){ // Netscape/Firefox/Opera
keynum = e.which;
}
alert(String.fromCharCode(keynum));
}
</script>
<form>
<input type="text" onkeypress="return myKeyPress(event)" />
</form>
JQuery:
$(document).keypress(function(event){
alert(String.fromCharCode(event.which));
});
keypress
yerine, sana bir karakter kodu verir olayı, keyup
ya keydown
sana bir anahtar kodunu verin.
e.key
hala tam tarayıcı desteğine sahip değil.
Burada bu sorunun bir milyon kopyası var, ama yine de burada tekrar var:
document.onkeypress = function(evt) {
evt = evt || window.event;
var charCode = evt.keyCode || evt.which;
var charStr = String.fromCharCode(charCode);
alert(charStr);
};
Gördüğüm önemli olaylarla ilgili en iyi referans http://unixpapa.com/js/key.html'dir .
Daha yeni ve çok daha temiz: kullanın event.key
. Artık keyfi sayı kodları yok!
NOT: Eski özellikler (
.keyCode
ve.which
) Kullanımdan Kaldırılmıştır.
node.addEventListener('keydown', function(event) {
const key = event.key; // "a", "1", "Shift", etc.
});
Yalnızca tek karakterlerin girildiğinden emin olmak istiyorsanız, kontrol edin key.length === 1
veya beklediğiniz karakterlerden biri olup olmadığını kontrol edin .
Deneyin:
<table>
<tr><td>Key:</td><td id="key"></td></tr>
<tr><td>Key Code:</td><td id="keyCode"></td></tr>
<tr><td>Event Code:</td><td id="eventCode"></td></tr>
</table>
<script type="text/javascript">
window.addEventListener("keydown", function (e) {
//tested in IE/Chrome/Firefox
document.getElementById("key").innerHTML = e.key;
document.getElementById("keyCode").innerHTML = e.keyCode;
document.getElementById("eventCode").innerHTML = e.code;
})
</script>
* Not: Bu, "Kod parçacığını çalıştır" da çalışır
Bu web sitesi yukarıdaki kodumla aynı şeyi yapıyor: Keycode.info
**check this out**
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(document).keypress(function(e)
{
var keynum;
if(window.event)
{ // IE
keynum = e.keyCode;
}
else if(e.which)
{
// Netscape/Firefox/Opera
keynum = e.which;
}
alert(String.fromCharCode(keynum));
var unicode=e.keyCode? e.keyCode : e.charCode;
alert(unicode);
});
});
</script>
</head>
<body>
<input type="text"></input>
</body>
</html>
Bunu sofistike bir şekilde yapan en sevdiğim kütüphanelerden biri Fare Kapanı .
Çeşitli eklentilerle stoklanmış olarak gelir; bunlardan biri, record
basılan bir dizi tuşu tanımlayabilen eklentidir.
Misal:
<script>
function recordSequence() {
Mousetrap.record(function(sequence) {
// sequence is an array like ['ctrl+k', 'c']
alert('You pressed: ' + sequence.join(' '));
});
}
</script>
<button onclick="recordSequence()">Record</button>