javascript-tutorial / javascript-tutorial/en.javascript.info

Keyboard events: keydown filtering example can't block IME-composed input (Korean/Japanese/Chinese)

Đang mở Phù hợp với người mới
#3,978 1 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Ngôn ngữ chính
HTML
Star
25.5k
Fork
4k
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

Article

Keyboard: keydown and keyup — the "Default actions" section, phone-number filter example:

<input onkeydown="return checkPhoneKey(event.key)" placeholder="Phone, please" type="tel">

Problem

The example (and the surrounding text) implies that returning false from keydown reliably prevents unwanted characters from being entered. That holds for direct (Latin) keyboard input, but not for languages typed through an IME (Input Method Editor), such as Korean, Japanese and Chinese.

With an IME active:

  • keydown fires with event.key == "Process" (and keyCode 229), not the actual character.
  • More importantly, calling preventDefault() / returning false on that keydown does not cancel the text insertion, because the character is produced by the IME composition, not by the key's default action.

As a result, Korean/Japanese/Chinese characters pass straight through the filter and appear in the field. This was reported by a Korean reader of the Korean translation (ko.javascript.info), and is easy to reproduce by switching to a Korean IME and typing into the demo.

Suggestion

Add a short note after the example, along these lines:

Please note: this filter only works for direct keyboard input. Text composed via an IME (used for languages such as Korean, Japanese or Chinese) is inserted by the input method, not by the key's default action, so it can't be blocked in keydown. That's one more reason why, for tracking or validating what actually gets into the field, the input event is a better choice.

This ties in nicely with the introduction of the article, which already recommends the input event for tracking input from any source.

Happy to send a PR if the note sounds good.

Hướng dẫn đóng góp

Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Hướng nghiên cứu

Mở bài viết Keyboard: keydown and keyup và xem lại phần Default actions, đặc biệt là ví dụ về bộ lọc số điện thoại và phần thảo luận về input event trong phần giới thiệu. Thêm một ghi chú ngắn giải thích hạn chế của IME và lý do nên ưu tiên input để theo dõi hoặc xác thực văn bản được chèn, sau đó đối chiếu cách diễn đạt với ví dụ.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
html, javascript
Lĩnh vực
documentation
Loại issue
Tài liệu
Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức độ hoạt động
Ít trao đổi
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
76/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.