Pertanyaan Bagaimana cara mengetahui kunci karakter apa yang ditekan?


Saya ingin mengetahui kunci karakter apa yang ditekan dengan cara kompatibel lintas-browser dalam javascript murni.


75
2017-12-04 12:17


asal


Jawaban:


JavaScript "Hapus":

<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)); 
});

128
2017-12-04 12:36



Ada sejuta duplikat dari pertanyaan ini di sini, tetapi di sini lagi pula:

document.onkeypress = function(evt) {
    evt = evt || window.event;
    var charCode = evt.keyCode || evt.which;
    var charStr = String.fromCharCode(charCode);
    alert(charStr);
};

Referensi terbaik tentang peristiwa penting yang pernah saya lihat adalah http://unixpapa.com/js/key.html.


27
2017-12-04 12:41



Lebih baru dan lebih bersih: gunakan event.key. Tidak ada lagi kode nomor yang sewenang-wenang!

node.addEventListener('keydown', function(event) {
    const key = event.key; // "a", "1", "Shift", etc.
});

Jika Anda ingin memastikan hanya satu karakter yang dimasukkan, periksa key.length === 1, atau itu adalah salah satu karakter yang Anda harapkan.

Mozilla Docs

Browser yang didukung


5
2017-09-05 18:03



Silahkan lihat di situs ini untuk inkonsistensi lintas browser http://www.quirksmode.org/js/keys.html


2
2017-12-04 12:26



Gunakan yang ini:

function onKeyPress(evt){
  evt = (evt) ? evt : (window.event) ? event : null;
  if (evt)
  {
    var charCode = (evt.charCode) ? evt.charCode :((evt.keyCode) ? evt.keyCode :((evt.which) ? evt.which : 0));
    if (charCode == 13) 
        alert('User pressed Enter');
  }
}

1
2017-12-04 12:31



**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>

1
2017-12-08 12:31



Salah satu perpustakaan favorit saya untuk melakukan ini dengan cara yang canggih adalah Perangkap tikus.

Muncul dengan berbagai plugin, salah satunya adalah record plugin yang dapat mengidentifikasi urutan tombol yang ditekan.

Contoh:

<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>

1
2017-11-13 13:47



document.onkeypress = function(event){
    alert(event.key)
}

-2
2018-03-07 19:10