2012-07-06 20 views
25

Mam tylko jedno pole wejściowe i chcę zarejestrować się w zdarzeniachChange i onKeyPress, aby wykryć, kiedy użytkownicy kończą wprowadzanie danych lub naciśnij klawisz Enter. Muszę używać tylko javascript. Dzięki za pomoc.Jak wykrywać, kiedy użytkownik naciśnie Enter w polu wejściowym

mam:

var load = function(){ 
    //I want to trigger this function when user hit Enter key. 
} 

document.getElementById('co').onchange=load; //works great 
document.getElementById('co').onKeyPress=load; 
//not sure how to detect when user press Enter 

html

//no form just a single input field 
<input type='text' id='co'> 
+0

Możliwy duplikat [Enter naciśnij zdarzenia w JavaScript] (http://stackoverflow.com/questions/905222/enter-key-press-event-in -javascript) – Bae

Odpowiedz

53
document.getElementById('foo').onkeypress = function(e){ 
    if (!e) e = window.event; 
    var keyCode = e.keyCode || e.which; 
    if (keyCode == '13'){ 
     // Enter pressed 
     return false; 
    } 
    } 

DEMO

+0

dodatkowe pytanie. Jak uzyskać dostęp do elementu foo po wykryciu użytkownika, naciśnij Enter? Nie mogę użyć tego słowa kluczowego, odnosi się ono do obiektu window. Wielkie dzięki – FlyingCat

+0

'this.value' powinno działać ... robi to w moim demo. – sachleen

+7

użyłbym 'if (keyCode === 13)' dla ścisłych równań – bobbyrne01

8

Aby ją przekroczyć przeglądarkę:

document.getElementById('foo').onkeypress = function(e) { 
    var event = e || window.event; 
    var charCode = event.which || event.keyCode; 

    if (charCode == '13') { 
     // Enter pressed 
     return false; 
    } 
} 

to zobaczyć pytanie, aby uzyskać więcej informacji: javascript event e.which?

0

Używam tego kodu i działa prawidłowo:

document.getElementById("theIdHere").onkeypressed = 
function() { 
    if(this.event.which === 13) 
     console('passed'); 
} 
2

Żadna z tych odpowiedzi jak dotąd szczegółowo odpowiedzieć na to pytanie. Pytanie składa się z dwóch części. 1. Enter jest wciśnięty. 2. Zastosowania koncentrują się na danych wejściowych.

$('#input-id').on("keyup", function(e) { 
    if (e.keyCode == 13) { 
     console.log('Enter'); 
    } 
}); 

W ten sposób ENTER zostanie wykryty tylko wtedy, gdy użytkownik naciśnie przycisk Z tego wejścia.

1

Bardziej aktualny i znacznie czyściejszy: użyj event.key zamiast event.keyCode. Koniec z dowolnymi kodami liczb!

const node = document.getElementById('co'); 
node.addEventListener('keydown', function onEvent(event) { 
    if (event.key === "Enter") { 
     return false; 
    } 
}); 

Mozilla Docs

Supported Browsers

Powiązane problemy