我正在尝试制作一个振荡器，您可以在正弦，三角形和正方形之间进行选择，您可以启动/停止振荡器。我通过停止原始振荡器并每次创建一个新的振荡器来开始/停止，但是当我这样做时，我想要我用滑块选择的频率设置和我用按钮选择的波形设置转移到新的振荡器。我没有任何问题转移音量设置，所以我不知道我做错了其他两个
下面是我的代码:<html>
<head>
<title>Session 4 - AudioAPI Objects</title>
<link rel="stylesheet" href="oscstylesheet.css">
</head>
<body>
<button onclick="myStart()" type="button">Start</button><br>
<button onclick="myStop()" type="button">Mute/Unmute</button><br>
<button onclick="Sin()" type="button">Sine</button><br>
<button onclick="Square()" type="button">Square</button><br>
<button onclick="Tri()" type="button">Triangle</button><br>
<input autocomplete="off" id="freqSlider" type="range" min="100" max="5000" value="440">
<input autocomplete="off" id="volumeSlider" type="range" min="0" max="1" value="0.5" step="0.01">
<script>
var isPlaying = false;
var volume = .5;
//Create audio context
let audioCtx = new (window.AudioContext || window.webkitAudioContext) ();
//Create an oscillator
let oscillator = audioCtx.createOscillator();
var freqValue = oscillator.frequency.value;
//Create a gain node
var volumeNode = audioCtx.createGain();
volumeNode.gain.value = volume;
//Set the oscillator frequency from now
//oscillator.frequency.setValueAtTime(440, audioCtx.currentTime);
freqSlider.addEventListener('input', (e) => {
oscillator.frequency.value = e.target.valueAsNumber;
});
volumeSlider.addEventListener('input', (e) => {
volumeNode.gain.value = e.target.valueAsNumber;
});
//Connect the oscillator to the destination
oscillator.connect(volumeNode);
volumeNode.connect(audioCtx.destination);
//Send the detail of the oscillator object to the console
console.log(oscillator);
// FUNCTIONS
function myStart(){
oscillator.start();
isPlaying = true;
console.log(oscillator);
}
function myStop() {
if (isPlaying) {
isPlaying = false;
oscillator.stop();
} else {
//the oscillators are created here because once they are stopped they can not
//be started again.
oscillator = audioCtx.createOscillator();
freqSlider.addEventListener('input', (e) => {
oscillator.frequency.value = e.target.valueAsNumber;
});
setFreqs();
oscillator.connect(volumeNode);
oscillator.start();
isPlaying = true;
}
}
function setFreqs() {
if (oscillator.type != "undefined") {
freqSlider.addEventListener('input', (e) => {
freqValue = e.target.valueAsNumber;
});
}
}
function handleVolumeChange(val) {
var element = document.getElementById("volumeLabel");
element.innerHTML = val;
volume = Number(val)/100;
volumeNode.gain.value = volume;
}
function handleCarrierChange(val) {
var element = document.getElementById("freqValue");
element.innerHTML = val;
freqValue = Number(val);
setFreqs();
}
//function myStop(){
//oscillator.stop();
//oscillatorNew = audioCtx.createOscillator();
//freqSlider.addEventListener('input', (e) => {
//oscillator.frequency.value = e.target.valueAsNumber;
//});
//oscillatorNew.connect(audioCtx.destination);
//oscillatorNew.start();
//}
function Sin(){
oscillator.type = "sine";
console.log(oscillator);
}
function Square(){
oscillator.type = "square";
console.log(oscillator);
}
function Tri(){
oscillator.type = "triangle";
console.log(oscillator);
}
</script>
</body>
</html>
您可以通过localStorage存储您的设置sessionStorage或
// Set Setting Item
localStorage.setItem("Setting", "SettingValue");
// Get Settings from Stored data:
let selectSetting = localStorage.getItem("Setting");
console.log(selectSetting);