Phát hiện phím Enter trong trường nhập văn bản


299

Tôi đang cố gắng thực hiện một chức năng nếu nhấn enter trong khi vào đầu vào cụ thể.

Tôi đang làm gì sai?

$(document).keyup(function (e) {
    if ($(".input1").is(":focus") && (e.keyCode == 13)) {
        // Do something
    }
});

Có cách nào tốt hơn để làm điều này sẽ nói, nếu nhấn vào .input1chức năng làm?


1
Bản sao có thể có của sự kiện nhấn phím Enter trong JavaScript
Bae

Câu trả lời:


499
$(".input1").on('keyup', function (e) {
    if (e.keyCode === 13) {
        // Do something
    }
});


//keyup not compatible with Jquery select(), Keydown is.

Trình duyệt nào bạn đã thử nghiệm nó? Tôi nghĩ rằng các phiên bản IE cũ hơn không kích hoạt các sự kiện keyup trên tài liệu (mặc dù không chắc chắn về điều này).
Joseph Silber

2
Mã của bạn không hoạt động vì bạn đã sử dụng .is () và cần === thay vì ==. Xem câu trả lời của tôi để biết thêm chi tiết.
wesbos

6
@jQuerybeast Không cần thiếtevent.keyCodelà một Number, vì vậy JavaScript sẽ thực hiện các bước tương tự với ==hoặc ===.
alex

7
e.which được tuyên bố là trình duyệt chéo hữu ích hơn
mohammad eslahi sani

2
Thuộc tính which, code, charCodekeyCodebị phản đối developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent , xin vui lòng thêm thông tin thực tế để trả lời bạn.
Sasay

120

event.key === "Nhập"

Gần đây và sạch sẽ hơn nhiều: sử dụng event.key. Không còn mã số tùy ý!

const node = document.getElementsByClassName(".input")[0];
node.addEventListener("keyup", function(event) {
    if (event.key === "Enter") {
        // Do work
    }
});

Nếu bạn phải sử dụng jQuery:

$(document).keyup(function(event) {
    if ($(".input1").is(":focus") && event.key == "Enter") {
        // Do work
    }
});

Tài liệu Mozilla

Trình duyệt được hỗ trợ


6
danh tiếng cho phiên bản javascript đơn giản, không hiểu tại sao tất cả những người khác đang ở trong trò đùa
Captain Fantastic

7
Bởi vì, OP đặt mã ví dụ của anh ấy vào jQuery và (cũng như JavaScript) jQuery được gắn thẻ.
Tigerrrrr

44
$(document).keyup(function (e) {
    if ($(".input1:focus") && (e.keyCode === 13)) {
       alert('ya!')
    }
 });

Hoặc chỉ liên kết với chính đầu vào

$('.input1').keyup(function (e) {
    if (e.keyCode === 13) {
       alert('ya!')
    }
  });

Để tìm ra keyCode nào bạn cần, hãy sử dụng trang web http://keycode.info


Cảm ơn bạn. Tôi đã học được một cái gì đó mới. Bằng cách này, tôi đã sử dụng .is () ALOT nhiều lần để nó không logic, không hoạt động. Ngoài ra, ==, một lần nữa tôi đã sử dụng hai == cho các tình huống khác
jQuerybeast

np, bạn nên luôn luôn sử dụng ===
wesbos

12

Hãy thử điều này để phát hiện Enterphím được nhấn trong hộp văn bản.

$(function(){

$(".input1").keyup(function (e) {
    if (e.which == 13) {
        // Enter key pressed
    }
 });

});

6

Có lẽ đã quá muộn để trả lời câu hỏi này. Nhưng đoạn mã sau chỉ đơn giản là ngăn phím enter. Chỉ cần sao chép và dán sẽ hoạt động.

        <script type="text/javascript"> 
        function stopRKey(evt) { 
          var evt = (evt) ? evt : ((event) ? event : null); 
          var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null); 
          if ((evt.keyCode == 13) && (node.type=="text"))  {return false;} 
        } 

        document.onkeypress = stopRKey; 

        </script>

6

Cách tốt nhất tôi tìm thấy là sử dụng keydown(cách keyupnày không hiệu quả với tôi).

Lưu ý: Tôi cũng đã tắt biểu mẫu gửi vì thông thường khi bạn muốn thực hiện một số hành động khi nhấn Enter Key, chỉ nghĩ rằng bạn không thích là gửi biểu mẫu :)

$('input').keydown( function( event ) {
    if ( event.which === 13 ) {
        // Do something
        // Disable sending the related form
        event.preventDefault();
        return false;
    }
});

event.keyCode không được chấp nhận event.như không, vì vậy điều này tốt hơn
Alex

3

Giải pháp phù hợp với tôi là như sau

$("#element").addEventListener("keyup", function(event) {
    if (event.key === "Enter") {
        // do something
    }
});

1

Hãy thử điều này để phát hiện phím Enter được nhấn trong hộp văn bản.

$(document).on("keypress", "input", function(e){
    if(e.which == 13){
        alert("Enter key pressed");
    }
});

BẢN GIỚI THIỆU


0
 $(document).ready(function () {
        $(".input1").keyup(function (e) {
            if (e.keyCode == 13) {
                // Do something
            }
        });
    });

0

Mã này xử lý mọi đầu vào cho tôi trong toàn bộ trang web. Nó kiểm tra phím ENTER bên trong trường INPUT và không dừng trên TEXTAREA hoặc các nơi khác.

$(document).on("keydown", "input", function(e){
 if(e.which == 13){
  event.preventDefault();
  return false;
 }
});
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.