javascript音频每次点击都会得到兰黛

今天我用Javascript实现了一些音频文件，效果很好。但是 我注意到，随着随后的每一次点击，声音都会变得更大。我已经使用了“Audio.volume”方法，但运气不好

我的代码：

var AppController = (function () {
    var correctItem, secondItem, thirdItem, selectedItems, selectedItemsShuffled;

var rotateImage = function() {
    var i = 0;
    var randomNumbers = createThreeRandomNumbers();

    var interval = window.setInterval(function () {
            i++;
            document.getElementById("imageToRotate").src= "img/" + items.images[i].imageLink;

            if (i === items.images.length -1) {
                i = -1;
            }
    }, 125);

    var clearData = function () {
        correctItem = "";
        secondItem = "";
        thirdItem = "";
        selectedItems = "";
        selectedItemsShuffled = "";
        removeNodeChildren("button-1");
        removeNodeChildren("button-2");
        removeNodeChildren("button-3");
    };



    var removeNodeChildren = function (obj) {
        var myNode = document.getElementById(obj);
        while (myNode.firstChild) {
            myNode.removeChild(myNode.firstChild);
        }
    };


    var resetGame = function () {
        clearData();
        document.getElementById("buttonWrapper").classList.remove("show");
        rotateImage();
    }


    document.getElementById("imageToRotate").addEventListener("click", function (e) {

        // select 3 items
        correctItem       = getSelectedItemDetails(e);
        secondItem = getRandomItem(correctItem);
        thirdItem = getSecondRandomItem(correctItem, secondItem);
        selectedItems = [correctItem, secondItem, thirdItem];
        selectedItemsShuffled = shuffleArray(selectedItems);

        // create the numbers 1 to 3 randomly
        var order = createThreeRandomNumbers();


        // remove the rotating effect
        clearInterval(interval);

        // set the images to the buttons in a random order.
        setItemsToButtons(order, selectedItemsShuffled);

        //show the buttons
        showButtons();

        // Create an event which triggers when a button is clicked.
        document.getElementById("buttonWrapper").addEventListener("click", function(e) {
            var valueOfButtonPressed = e.srcElement.innerText.toLowerCase();
            var clickedButton = e.srcElement.id;

            if (valueOfButtonPressed === correctItem) {
                document.getElementById(clickedButton).innerHTML = e.srcElement.innerText.toLowerCase() + '<span class="icon"><i class="fa fa-check green" aria-hidden="true"></i></span>';

                if (!audio) {
                    var audio = new Audio("audio/correct.mp3");
                }

                audio.play();
                audio.volume = 0.5;

                setTimeout(resetGame, 5000);

            } else {
                document.getElementById(clickedButton).innerHTML = e.srcElement.innerText.toLowerCase() + '<span class="icon"><i class="fa fa-times  red" aria-hidden="true"></i></span>';

                if (!audio) {
                    var audio = new Audio("audio/wrong.mp3");
                }

                audio.play();
                audio.volume = 0.5;

                setTimeout(resetGame, 5000);
            }
        });
    });
};




// 1: hide the buttons
hidebuttons();

// 2: Replace the title
replaceTitle("Animals");

// 3: set up image rotation until it's clicked.
rotateImage();
})();

var-AppController=（函数（）{
var correctItem、secondItem、thirdItem、selectedItems、selectedItemsShuffled；
var rotateImage=函数（）{
var i=0；
var randomNumbers=createThreeRandomNumbers（）；
var interval=window.setInterval（函数（）{
i++；
document.getElementById（“imageToRotate”）.src=“img/”+items.images[i].imageLink；
if（i==items.images.length-1）{
i=-1；
}
}, 125);
var clearData=函数（）{
更正项目=”；
第二项=”；
第三名=”；
selectedItems=“”；
selectedItemsShuffled=“”；
移除儿童（“按钮1”）；
移除儿童（“按钮2”）；
移除儿童（“按钮3”）；
};
var removeNodeChildren=函数（obj）{
var myNode=document.getElementById（obj）；
while（myNode.firstChild）{
myNode.removeChild（myNode.firstChild）；
}
};
var resetGame=函数（）{
clearData（）；
document.getElementById（“ButtonRapper”）.classList.remove（“show”）；
旋转图像（）；
}
document.getElementById（“imageToRotate”）.addEventListener（“单击”，函数（e）{
//选择3项
correctItem=getSelectedItemDetails（e）；
secondItem=getRandomItem（正确项）；
thirdItem=getSecondRandomItem（正确项，第二项）；
selectedItems=[correctiitem，secondItem，thirdItem]；
selectedItemsShuffled=shufflarray（selectedItems）；
//随机创建数字1到3
var order=createThreeRandomNumbers（）；
//消除旋转效应
间隔时间；
//按随机顺序将图像设置为按钮。
setItemsToButtons（顺序，selectedItemsShuffled）；
//显示按钮
显示按钮（）；
//创建在单击按钮时触发的事件。
document.getElementById（“ButtonRapper”）.addEventListener（“单击”，函数（e）{
var valueOfButtonPressed=e.srcElement.innerText.toLowerCase（）；
var clickedButton=e.srcmelement.id；
if（按下按钮的值===correctItem）{
document.getElementById（clickedButton）.innerHTML=e.srcElement.innerText.toLowerCase（）+“”；
如果（！音频）{
var audio=新音频（“audio/correct.mp3”）；
}
音频播放（）；
audio.volume=0.5；
设置超时（重置游戏，5000）；
}否则{
document.getElementById（clickedButton）.innerHTML=e.srcElement.innerText.toLowerCase（）+“”；
如果（！音频）{
var audio=新音频（“audio/error.mp3”）；
}
音频播放（）；
audio.volume=0.5；
设置超时（重置游戏，5000）；
}
});
});
};
//1：隐藏按钮
隐藏按钮（）；
//2：替换标题
替换名称（“动物”）；
//3：设置图像旋转，直到单击为止。
旋转图像（）；
})();

---

任何帮助都将不胜感激。干杯

我很确定原因是每次单击都会生成一个新的

Audio

对象

而不是每次单击都执行此操作：

var audio = new Audio("audio/correct.mp3");

---

检查音频是否已经存在。如果有，只需执行

audio.play（）

。如果没有，则创建一个新的音频对象。

可能是因为每次单击都会创建一个新的音频变量。是否每次都尝试重新使用相同的音频对象？通过在每次将声音加倍时创建一个新实例，您是否检查了文档以确保

audio.volume

是设置音量的正确方法？此外，您似乎从未停止音频；虽然idk，如果需要的话。打得好。我用if语句编辑了代码。但是没有区别。