Javascript: Các hàm được gọi trên tải trang thay vì onclick/onsubmit

Question

Tôi khá mới đối với JS, nhưng tôi đã lập trình bằng C trước đây và tôi đang cố gắng thu hút sự chú ý của toàn bộ sự kiện. Tôi đang cố gắng để tạo ra một kịch bản mà sẽ xác nhận đầu vào hình thức, tuy nhiên tất cả các mã của tôi đang được chạy - tất cả mọi thứ bên trong nếu/người khác, vòng, những gì có bạn - bất kể sự kiện xảy ra hay không. Để kiểm tra, và để làm cho nó dễ dàng hơn để đăng ở đây, tôi đã viết một chương trình đơn giản mà có vấn đề này quá.

HTML:

<button id="test">Test</button> 

Javascript:

function init(){ 
    document.getElementById("test").onclick = alert("hello"); 
} 

window.onload = init; 

Từ những gì tôi hiểu, hàm init nên được gọi khi tải trang (window.onload), và cảnh báo sẽ bật lên khi nút có ID "test" được nhấp (onclick). Điều thực sự xảy ra là cảnh báo sẽ xuất hiện ngay sau khi trang tải và sẽ xuất hiện trở lại nếu tôi nhấn nút.

Suy nghĩ của tôi là tôi đã đưa ra một số giả định không chính xác về thứ tự mà JS được thực hiện, nhưng tôi không thể nghĩ đó là cái gì. Có ai có thể làm sáng tỏ điều này không?

Answer 1

Đó là không đúng, nó phải là:

function init(){ 
    document.getElementById("test").onclick = function() { alert("hello"); }; 
} 

Đây là bởi vì bạn cần trong JavaScript bạn cần phải gán các chức năng chính nó để click sự kiện (cảnh báo là một chức năng).

Cầm lấy cái này ví dụ:

function hello() { 
    alert("hello"); 
} 

document.getElementById("test").onclick = hello; 

Lưu ý rằng tôi không đặt dấu ngoặc () sau hello chức năng? Đó là bởi vì tôi đang sử dụng một tham chiếu đến chính hàm đó. Nếu tôi đặt dấu ngoặc đơn, tôi thực sự là đánh giá chức năng đó tại thời điểm chuyển nhượng nhấp chuột xảy ra.

Vì vậy, thực hiện:

document.getElementById("test").onclick = hello(); 

sẽ hiển thị cảnh báo sẽ hiển thị các alertngay sau dòng này đã được thực hiện.

Answer 2

có chức năng javascript của bạn sẽ chỉ gọi khi trang sẽ được tải .Nếu bạn cũng muốn gọi đó là init() chức năng vào nút nhấp chuột thử nghiệm vì vậy hãy thử như thế này:

JavaScript:

function init(){ alert("hello"); } 
 

 
window.onload = init;

HTML: 
 
<button id="test" onClick='init()'>Test</button>