March 4, 2025 html

Cara Menonaktifkan Enter Untuk Submit pada Input

Secara default, menekan Enter pada <input> dalam sebuah form akan menyebabkan form tersubmit. Untuk mencegahnya, ikuti langkah-langkah berikut:

Tambahkan event listener keydown pada input untuk menangkap setiap tombol yang ditekan pada input.

<form>
    <input type="email" name="email" />
</form>

<script>
    document.querySelector('[name=email]')
        .addEventListener('keydown', e => {})
</script>

Kemudian, cek properti key pada objek event, jika nilainya Enter maka panggil method preventDefault pada objek event untuk mencegah form tersubmit.

<form>
    <input type="email" name="email" />
</form>

<script>
    document.querySelector('[name=email]')
        .addEventListener('keydown', e => {
            if (e.key === 'Enter') {
                e.preventDefault()
            }
        })
</script>