Nguyên mẫu - Xử lý sự kiện

Quản lý sự kiện là một trong những thách thức lớn nhất để đạt được kịch bản trên nhiều trình duyệt. Mỗi trình duyệt đều có các cách tiếp cận khác nhau để xử lý các phím bấm.

Prototype Framework xử lý tất cả các vấn đề về khả năng tương thích giữa các trình duyệt và giúp bạn không gặp phải mọi rắc rối liên quan đến quản lý sự kiện.

Prototype Framework cung cấp không gian tên Sự kiện , chứa đầy các phương thức, tất cả đều lấy đối tượng sự kiện hiện tại làm đối số và vui vẻ tạo ra thông tin bạn đang yêu cầu, trên tất cả các trình duyệt chính.

Không gian tên sự kiện cũng cung cấp danh sách mã khóa được chuẩn hóa mà bạn có thể sử dụng với các sự kiện liên quan đến bàn phím. Các hằng số sau được xác định trong không gian tên:

Không.	Hằng số & Mô tả chính
1.	KEY_BACKSPACE Biểu diễn phím khoảng trắng trở lại.
2.	KEY_TAB Biểu diễn phím tab.
3.	KEY_RETURN Biểu diễn khóa trả về.
4.	KEY_ESC Đại diện cho khóa esc.
5.	KEY_LEFT Biểu diễn phím bên trái.
6.	KEY_UP Đại diện cho khóa.
7.	KEY_RIGHT Biểu diễn khóa bên phải.
số 8.	KEY_DOWN Đại diện cho phím xuống.
9.	KEY_DELETE Đại diện cho khóa xóa.
10.	KEY_HOME Đại diện cho phím home.
11.	KEY_END Đại diện cho khóa kết thúc.
12.	KEY_PAGEUP Đại diện cho khóa trang lên.
13.	KEY_PAGEDOWN Phím đại diện xuống trang.

Cách xử lý sự kiện

Trước khi bắt đầu, chúng ta hãy xem một ví dụ về việc sử dụng phương thức sự kiện. Ví dụ này cho thấy cách nắm bắt phần tử DOM mà sự kiện đã xảy ra.

Thí dụ

<html>
   <head>
      <title>Prototype examples</title>
      <script type = "text/javascript" src = "/javascript/prototype.js"></script>
      
      <script>
         // Register event 'click' and associated call back.
         Event.observe(document, 'click', respondToClick);
  
         // Callback function to handle the event.
         function respondToClick(event) {
            var element = event.element();
            alert("Tag Name : " + element.tagName );
         }
      </script>
   </head>

   <body>
      <p id = "note"> Click on any part to see the result.</p>
      <p id = "para">This is paragraph</p>
      <div id = "division">This is divsion.</div>
   </body>
</html>

Đầu ra

Đây là danh sách đầy đủ tất cả các phương pháp liên quan đến Event. Các chức năng mà bạn có nhiều khả năng sẽ sử dụng nhiều nhất là quan sát , yếu tố và dừng .

Phương pháp sự kiện nguyên mẫu

NOTE - Đảm bảo ít nhất bạn có phiên bản 1.6 của prototype.js.

Không.	Phương pháp & Mô tả
1.	thành phần() Trả về phần tử DOM mà sự kiện đã xảy ra.
2.	mở rộng() Mở rộng sự kiện với tất cả các phương thức có trong Event.Methods.
3.	findElement () Trả về phần tử DOM đầu tiên có tên thẻ đã cho, trở lên từ phần tử mà sự kiện đã xảy ra.
4.	isLeftClick () Xác định xem sự kiện chuột liên quan đến nút có phải là về nút "trái" (thực tế là chính) hay không.
5.	quan sát () Đăng ký một trình xử lý sự kiện trên một phần tử DOM.
6.	pointerX () Trả về vị trí ngang tuyệt đối cho một sự kiện chuột.
7.	con trỏY () Trả về vị trí thẳng đứng tuyệt đối cho một sự kiện chuột.
số 8.	dừng lại() Dừng sự lan truyền của sự kiện và cuối cùng ngăn hành động mặc định của nó được kích hoạt.
9.	stopObserving () Hủy đăng ký một trình xử lý sự kiện.
10.	dỡ bỏ bộ nhớ đệm () Hủy đăng ký tất cả các trình xử lý sự kiện đã đăng ký thông qua quan sát. Tự động có dây cho bạn. Không có sẵn kể từ ngày 1.6.