button.onclick執行時間

我只是在學習JS，我正在使用Head First書籍。在教訓之一，下面的代碼是給建立的事件處理程序的按鈕：button.onclick執行時間

window.onload = init 

function init() { 
    var button = document.getElementById("addButton"); 
    button.onclick = handleButtonClick; 
} 
function handleButtonClick() { 
    alert("Button has been pressed"); 
}

當我在瀏覽器中測試代碼，警報彈出當我點擊按鈕，符合市場預期。所以，我重新安排了一些東西，試過，只是爲了看看會發生什麼：

window.onload = init 

function init() { 
    var button = document.getElementById("addButton"); 
    button.onclick = alert("Button has been pressed"); 
}

現在警報只要在頁面加載顯示出來，但我想不出爲什麼。爲什麼警報沒有等到按鈕被點擊？我是一個JS和編程的完整新手。謝謝！

來源

2014-10-10 Bretto

你需要把它們放在一個功能，否則它會立即執行：

window.onload = init 
 

 
function init() { 
 
    var button = document.getElementById("addButton"); 
 
    button.onclick = function(){ alert("Button has been pressed") }; 
 
}

<button id="addButton">Alert</button>

這是因爲你想分配alert()到一個按鈕的onclick屬性，這是不可能的。 JavaScript常常「很好地」失敗，「奇怪地行事而不是拋出錯誤，試圖阻止網頁完全崩潰。當它看到alert()時，它立即執行。

如果您將其封裝在一個函數中，您可以將該函數分配給onclick屬性，它將按預期工作。

來源

2014-10-10 01:47:26 AstroCB

將屬性只接受作爲一般的任務？這只是JS的任意規則？ – Bretto 2014-10-10 02:03:34

@Brett它取決於財產，但並非總是如此。 'onclick'指定一個[事件監聽器]（https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener）給給定的元素，所以你需要爲這個值傳遞一個函數。 – AstroCB 2014-10-10 02:05:12

是的，onclick採取了一個功能 - 只是通過alert()將立即執行。你需要做的：

button.onclick = function() { 
    alert("Button has been pressed"); 
}

來源

2014-10-10 01:46:41 tymeJV

它是預期的。使用Javascript將運行alert("Button has been pressed");你可能想將其更改爲button.onclick = function() {alert("Button has been pressed"); };

有用的閱讀一下：

Why do you need to invoke an anonymous function on the same line?

http://www.quirksmode.org/js/events_advanced.html

來源

2014-10-10 01:47:47 Hatjhie

button.onclick執行時間

回答

相關問題