Menjalankan aksi saat tombol Enter ditekan membuat form terasa cepat, misalnya pencarian instan atau mengirim pesan chat. Artikel ini membahas cara mendeteksi tombol Enter ditekan di JavaScript.
Event keydown
<input type="text" id="cari">
<script>
document.getElementById("cari").addEventListener("keydown", function(e) {
if (e.key === "Enter") {
console.log("Enter ditekan!");
}
});
</script>
Properti e.key berisi nama tombol. Ini lebih modern dibanding keyCode yang sudah usang.
Contoh Kasus: Kirim Chat dengan Enter
<script>
const input = document.getElementById("pesan");
input.addEventListener("keydown", function(e) {
if (e.key === "Enter" && !e.shiftKey) {
e.preventDefault(); // cegah baris baru
kirimPesan(input.value);
input.value = "";
}
});
</script>
Pemeriksaan !e.shiftKey memungkinkan Shift+Enter untuk baris baru, seperti aplikasi chat sungguhan.
Kesimpulan
Gunakan event keydown dan periksa e.key === "Enter" untuk mendeteksi Enter. Tambahkan !e.shiftKey agar Shift+Enter tetap bisa membuat baris baru pada kolom chat.
Referensi: untuk penjelasan lebih mendalam, kunjungi dokumentasi resmi JavaScript (MDN).

