按钮onclick不执行功能
我的小提琴有问题：https：//jsfiddle.net/5L7etues/ button onclick="myValami()" ，似乎不起作用。此按钮应该在函数“myValami”中执行clearinterval，但它什么也不做。 我拼写检查，不止一次检查。 我浏览了几个问题，似乎都不能解决我的问题。 我甚至试图从W3schools一步一步的复制代码https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_win_clearinterval，但仍然没有奏效。 我怀疑我错过了明显的东西。 我感谢任何答案！
使用addEventListener附加事件侦听器，而不是内联JavaScript：
var c = document.getElementById("Canvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#ff0066";
ctx.fillRect(100, 100, 50, 50);
var X = 100;
var Y = 100;
var W = 50;
var H = 50;
var interval = window.setInterval(myRect, 10);
function myRect() {
ctx.fillRect(X, Y, W, H);
ctx.fillRect(X = X + 1, Y, W, H);
}
function myValami() {
clearInterval(interval);
}
var button = document.querySelector('button');
button.addEventListener('click', myValami);<canvas id="Canvas" width="400" height="200" style="border:1px solid #000000;"></canvas>
<button>STOP</button>固定：
https://jsfiddle.net/5L7etues/4/
为该按钮设置一个id（例如id =“btnStop”）并使用如下函数：
btnStop.onclick = function() {
clearInterval(interval);
}