Question

我正在从下面的链接中创建一个时钟，并添加了诸如单方按钮之类的附加功能，可以播放音乐并每秒更改BodyBGcolor。

https://codepen.io/codifiedconcepts/pen/bwgxRq

音乐可以正常播放和暂停，但是如果单击以暂停，BG会开始变化，但不会停止，如果再次单击该按钮，则会开始闪烁并变得更快。

builder.equal(root.get("user").get("name"),user.getName());

我还有另一个功能，每天早上，中午，晚上等一天更改5次BGcolor。作为切换语句，我在这里展示一种情况。

var partyTime = false;
var catMusic = new Audio("media/party.mp3");

function partyEvent() {
// partyTime and catMusic are defined outside
// otherwise they get re-defined without changing the old definition
 if (partyTime === false) {
  partyTime = true;
  catMusic.play();
  partyBtn.innerHTML = "PARTY OVER";
} else {
  partyTime = false;
  catMusic.pause();
  partyBtn.innerHTML = "PARTY TIME";
 }
}

var i = 0;
function changeBG() {
var color = ["red", "blue", "brown", "green"];
document.body.style.backgroundColor = color[i];
i = (i + 1) % color.length;

 if (partyTime === true) {
  var initBG = setInterval(changeBG, 1000);
} else {
  clearInterval(initBG);
}
}

请帮助这个菜鸟，对于缩进来说很抱歉，粘贴到这里后，一切都一样。

Answer 1

if (partyTime === true) {
    var initBG = setInterval(changeBG, 1000);
} else {
    clearInterval(initBG);
}

在这里，您正在if块本地创建initBG。在else块中，initBG未定义，因此不会停止interval进程。

解决方案：在initBG函数之外定义partyEvent。

var initBG;
if (partyTime === true) {
    initBG = setInterval(changeBG, 1000);
} else {
    clearInterval(initBG);
}

javascript更改背景并用一个按钮播放声音

1 个答案: