Question

music.pause();似乎没有在我的代码中工作。当我点击播放按钮（按钮是使用html 5画布中的一个框进行）时，它可以播放音乐，但是当我点击停止按钮时，它不起作用。请帮帮我。

这是我的代码：

var X = 0;
var Y = 0;
var mouse_click = false;

canvas.addEventListener("mousemove", function(e){  
    var boundRect = canvas.getBoundingClientRect();

    X =  e.pageX - boundRect.left  ;
    Y = e.pageY ;
    console.log(e.pageX+" "+e.pageY);
});

canvas.addEventListener("mousedown",function(e){
    mouse_click = true;
    var music_canon = new Audio("Assets/Music/Canon.mp3");

    if((X>=5 && X<=40) && (Y>=500 && Y<=560))  // for play button
    {
        music_canon.play();
    }

    else if ((X>=45 && X<=82) && (Y>=500 && Y<=560)) // for stop button
    {
        music_canon.pause(); //this code is not working, it's not stop the music
    }

当我点击停止按钮时，音乐仍然继续。

Answer 1

这是因为你每次都在创造一个新元素。相反，在函数外部创建music_canon并每次引用相同的实例。

var music_canon = new Audio("Assets/Music/Canon.mp3");
canvas.addEventListener("mousedown", function(e) {
     if((X >= 5 && X <= 40) && (Y >= 500 && Y <= 560)) {
         music_canon.play();
     } else if ((X > =45 && X <= 82) && (Y >= 500 && Y <= 560)) {
         music_canon.pause();
     }
});

音乐不能停止使用music.pause（）

1 个答案: