我需要帮助,能够关闭和在我的网站上给出的按钮的声音的声音。我不能通过按下开关开关并通过localStorage或Cookies存储它来做到这一点。如果有人知道如何修复它,我将非常感激。Т汉克斯!
HTML
<div class="setting">
<input class="sound-toggle" type="checkbox" id="sound-toggle" />
<label for="sound-toggle">Звук</label>
</div>
<audio id="audio" src="audio/tap.mp3"></audio>
JS
$("audio").prop('muted', false);
$(".sound-toggle").click( function (){
if( $("audio").prop('muted') ) {
$("audio").prop('muted', false);
} else {
$("audio").prop('muted', true);
}
});
我就是这样做的:https://github.com/gregor-dev-443/gregor-dev-443.github.io/blob/main/buttontapsoundstest.html.
你可以试试https://gregor-dev-443.github.io/buttontapsoundstest.html.
注意:声音需要一些时间来加载,所以它不会立即工作。
我不能使用嵌入式代码片段,因为它们不允许使用本地存储。
编辑链接现在失效了,代码如下:
<!DOCTYPE html>
<html>
<head>
<title>Test for button tap sounds</title>
<meta charset="utf-8" />
</head>
<body>
<h1>Test for button tap sounds</h1>
<p>
<input type="checkbox" id="mute-checkbox" check />
<label for="mute-checkbox">Mute</label>
</p>
<p>
<button id="test-button">Test</button>
</p>
<audio id="tap-sound" src="https://opengameart.org/sites/default/files/Menu%20Selection%20Click.wav"></audio>
<script>
//Store the HTML elements in variables
const muteCheckbox = document.getElementById("mute-checkbox");
const tapSound = document.getElementById("tap-sound");
const testButton = document.getElementById("test-button");
//Automatically enable the checkbox when the item "muted" is present in local storage
if (localStorage.getItem("muted")) {
muteCheckbox.checked = true;
}
//Add the item "muted" to local storage when the checkbox is enabled and remove the item when it isn't enabled anymore
muteCheckbox.addEventListener("change", () => {
if (muteCheckbox.checked) {
localStorage.setItem("muted", "on");
} else {
localStorage.removeItem("muted");
}
});
//Play the sound when the button is clicked and the item "muted" isn't present in local storage
testButton.addEventListener("click", () => {
if (!localStorage.getItem("muted")) {
tapSound.play();
}
});
</script>
</body>
</html>