2012-12-14 16 views
10

Muszę wykryć, kiedy ktoś uderza "wprowadź" w wejściach tekstowych o określonej klasie.Wykryj wprowadzanie elementów wejściowych pewnej klasy.

Moje jQuery jest następujący:

$('input.large').keypress(function (e) { 
    if(e.which ==13) 
     console.log("pressed enter"); 
}); 

Moje HTML jest coś takiego:

<tr><td> Personal Name </td></tr> 
<tr><td> <input type='text' class='large'> </td></tr> 

<tr><td> Email</td></tr> 
<tr><td> <input type='text' class='large'> </td></tr> 

Kiedy dałem pól identyfikatorów i próbował $('#elementid').keypress to działało. Ale to nie działa. Nie otrzymuję wyjścia konsoli. czego mi brakuje?

+0

Czy umieściłeś swój kod w dokumencie gotowy do obsługi? – undefined

+0

Mam. Inny kod tuż przed i po tym działa dobrze. – user961627

+0

Czy możesz dostarczyć demo na http://jsfiddle.net? – undefined

Odpowiedz

10

Można używać na żywo (.on()) wydarzenia document z keydown (Myślę, że to jest lepsze) . Umożliwi to wykrycie keydown w bieżących i przyszłych elementach pasujących do selektora.

HTML:

<strong>Personal Name</strong> 
<input type='text' class='large' /><br /> 

<strong>Email</strong> 
<input type='text' class='large' /> 
​ 

JS (runnable z jQuery 1.7+):

jQuery(document).on('keydown', 'input.large', function(ev) { 
    if(ev.which === 13) { 
     // Will change backgroundColor to blue as example 
     this.style.backgroundColor = '#EFF'; 

     // Avoid form submit 
     return false; 
    } 
}); 

jsFiddle: http://jsfiddle.net/qvhWD/

+0

gdzie powinienem to jednak umieścić? Próbowałem go wewnątrz '$ (document) .ready (function() {...});' a także poza nim, ale tak czy owak wystąpił błąd składniowy. – user961627

+0

Gdzie jest ten błąd składni?** Spróbuj **: utwórz ekskluzywny element '

2

sprawdzenie tego: http://jsfiddle.net/EJyyr/

stosować tę HTML:

<tr><td> Personal Name </td></tr> 
<tr><td> <input type='text' class='large' id='a'> </td></tr> 

<tr><td> Email</td></tr> 
<tr><td> <input type='text' class='large' id='b'> </td></tr> 

i to jest jQuery which logs the input text id

$('.large').keypress(function (e) { 
    if(e.which ==13) 
    console.log($(this).attr('id')); 
}); 
0

Dzięki David Rodrigues za wyjaśnienie. To bardzo pomogło. Musiałem zaktualizować bibliotekę JQuery, a funkcja .live() została zatrzymana, aby działała poprawnie.

Można go używać z następującym

Zaznacz wszystkie wejścia pole wyboru postaci, gdy kliknięcie select_all_checkboxes input type wyboru:

jQuery(document).on("click", "#select_all_checkboxes", function(){ 
    var chk = this.checked; 
    $('input[id=selectAll]').each(function(){ 
     this.checked = chk; 
    }); 
}); 

wywołać funkcję „CheckMail”, kiedy użytkownik opuścił boisko za pomocą tabulatora kliknięcie dowolnego pola, które ma nazwę klasy "e-mail":

jQuery(document).on("blur", 'input.email', function(event){ 
    var email = $(this).val(); 
    if (!checkMail(email)) { 
     alert("Invalid email."); 
     $(this).focus(); 
    } 
}); 
+0

Podczas gdy twoja odpowiedź jest doceniana, komentarz na odpowiedź innego użytkownika powinien być właśnie taki. – J0e3gan

Powiązane problemy