Khi tạo trang, đôi khi cần thiết khi bạn nhấp vào nút được đặt trong trang, một số sự kiện do tác giả lập trình xảy ra trong trình duyệt. Để thực hiện việc này, bạn cần đặt mã JavaScript trong tài liệu đã tạo và liên kết nó với nút bắt buộc. Tùy thuộc vào số lượng mã được yêu cầu để triển khai sự kiện dự định, bạn có thể sử dụng các cách khác nhau để kết nối nút với mã.
Hướng dẫn
Bước 1
Thông thường, các lệnh gọi mã JavaScript bị ràng buộc với sự kiện onclick, nghĩa là với lần nhấp vào nút chuột trái. Nếu bạn không cần nhiều mã để mô tả hành động cần xảy ra, thì tất cả chúng có thể được đặt trực tiếp trong thẻ nút. Ví dụ: để lập trình trình duyệt hiển thị một thông báo đơn giản khi một nút được nhấp vào, tập lệnh JavaScript sẽ giống như sau: alert ('Mã đã hoạt động!') Chỉ cần một câu lệnh và văn bản. Tất cả điều này có thể dễ dàng được đặt trong mô tả sự kiện onclick của thẻ nút. Trong trường hợp này, mã HTML đơn giản nhất của trang có thể trông giống như sau:
Nút có mã
Nút có mã
Bước 2
Không thực tế khi đặt mã JavaScript phức tạp hơn trực tiếp trong thẻ nút. Thật dễ dàng hơn để tạo một chức năng riêng biệt khỏi nó và đưa lệnh gọi của nó vào sự kiện onclick. Ví dụ: điều này có thể trông giống như một hàm hiển thị một cửa sổ chứa thời gian của một lần nhấp vào nút: function getTime () {
var now = new date ();
alert ("Mã đã hoạt động trong" + now.getHours () + ":" + now.getMinutes ());
} Nó phải được đặt trong tiêu đề của trang (giữa các thẻ và). Mã hoàn chỉnh của trang có lệnh gọi hàm này được liên kết với nút có thể trông giống như sau:
Nút gọi chức năng
function getTime () {
var now = new date ();
alert ("Mã đã hoạt động trong" + now.getHours () + ":" + now.getMinutes ());
}
Nút gọi chức năng
Bước 3
Phương pháp tương tự nên được sử dụng khi nhấp vào một số nút khác nhau sẽ tạo ra một sự kiện có thể được mô tả bằng cùng một mã JavaScript. Ví dụ: bạn có thể sửa đổi một chút chức năng trước đó để thêm nhận dạng của nút đã nhấn vào hộp thông báo: function getTime (btnString) {
var now = new date ();
alert (btnString + "đã nhấp vào" + now.getHours () + ":" + now.getMinutes ());
} Mã hoàn chỉnh cho một trang có ba nút như vậy có thể trông giống như sau:
Ba nút với một cuộc gọi chức năng
function getTime (btnString) {
var now = new date ();
alert (btnString + "đã nhấp vào" + now.getHours () + ":" + now.getMinutes ());
}
Nút đầu tiên
Nút thứ hai
Nút thứ ba
