按鈕的onClick作品，但JS事件偵聽器不

Question

我有以下按鈕：

<input type="button" class ="anhalteButton" id="StopButton" value="&#9611 &#9611"/> 

，我想執行以下功能（viewsLoop是一個全局變量）：

function clearTDLoop(){ 

    clearInterval(viewsLoop); 
} 

如果我通過按鈕的onclick屬性調用該功能。即： onclick="clearTDLoop()"它完美地工作。

但是，我想通過一個JS事件監聽器調用該函數，但這根本不起作用。你們有什麼想法我可能做錯了嗎？我的事件監聽器代碼附加：

var stopButtonEl = document.getElementById("StopButton"); 
stopButtonEl.addEventListener("click",clearTDLoop); 

Sry基因的前混亂，那裏有我的代碼示例說明「StartButton」的按鈕ID，我抄錯ID，問題仍然存在..

Answer 1

我樹立了榜樣碼給你，請查看：

var tdLoop; 
 
var counter = 0; 
 

 
var startButton = document.getElementById('startButton'); 
 
startButton.addEventListener('click', startTDLoop, false); 
 

 
var stopButton = document.getElementById('stopButton'); 
 
stopButton.addEventListener('click', clearTDLoop, false); 
 

 
var result = document.getElementById('result'); 
 

 
function startTDLoop() { 
 
    tdLoop = setInterval(updateValue, 1000); 
 
} 
 

 
function updateValue() { 
 
    counter++; 
 
    result.innerHTML = counter; 
 
} 
 

 
function clearTDLoop() { 
 
    counter = 0; 
 
    clearTimeout(tdLoop); 
 
}

#result { 
 
    padding: 15px 0 0; 
 
}

<input type="button" class ="anhalteButton" id="startButton" value="Start"/> 
 
<input type="button" class ="anhalteButton" id="stopButton" value="Stop"/> 
 

 
<div id="result"></div>

Answer 2

它看起來就像你有錯誤ID爲您事件偵聽器：

var startButtonEl = document.getElementById("StartButton"); 
startButtonEl.addEventListener("click",clearTDLoop); 

應該是：

var stopButtonEl = document.getElementById("StopButton"); 
stopButtonEl.addEventListener("click",clearTDLoop);