周波数を設定して「音を鳴らす」ボタンを押すと音が鳴ります
音量に注意して鳴らして下さい。
最初は小さい音に設定してから少しずつ大きくすることをお勧めします。
スピーカーによって高周波数の音が鳴らない場合があります。
440Hz
1000Hz
2000Hz
4000Hz
8000Hz
モスキート音(17000Hz)
ド レ ミ ファ ソ ラ シ ド
音を鳴らす 音を止める
ソースコード
<input type="range" value="440" max="18000" min="10" step="1" id="hz" style="max-width:100%;width:600px;"><br> <div id="hz_label">440Hz</div> <a onclick="setHz(1000)" style="cursor:pointer;">1000Hz</a> <a onclick="setHz(2000)" style="cursor:pointer;">2000Hz</a> <a onclick="setHz(4000)" style="cursor:pointer;">4000Hz</a> <a onclick="setHz(8000)" style="cursor:pointer;">8000Hz</a> <a onclick="setHz(17000)" style="cursor:pointer;">モスキート音(17000Hz)</a> <br> <a onclick="setHz(261)" style="cursor:pointer;">ド</a> <a onclick="setHz(294)" style="cursor:pointer;">レ</a> <a onclick="setHz(330)" style="cursor:pointer;">ミ</a> <a onclick="setHz(349)" style="cursor:pointer;">ファ</a> <a onclick="setHz(392)" style="cursor:pointer;">ソ</a> <a onclick="setHz(440)" style="cursor:pointer;">ラ</a> <a onclick="setHz(494)" style="cursor:pointer;">シ</a> <a onclick="setHz(522)" style="cursor:pointer;">ド</a> <br> <a onclick="" style="cursor:pointer;" id="play">音を鳴らす</a> <a onclick="" style="cursor:pointer;" id="stop">音を止める</a> <br> <script> var audioCtx = null,oscillator=null; window.addEventListener('DOMContentLoaded',function(){ //周波数変更 document.getElementById('hz').addEventListener('input',function(){ document.getElementById('hz_label').innerHTML=document.getElementById('hz').value+'Hz'; if(oscillator!=null){ let hz=document.getElementById('hz').value; oscillator.frequency.setValueAtTime(hz, audioCtx.currentTime); } }); //音を鳴らす document.getElementById('play').addEventListener('click',function(){ if(audioCtx==null){ audioCtx = new (window.AudioContext || window.webkitAudioContext)(); } if(oscillator==null){ oscillator = audioCtx.createOscillator(); oscillator.type = 'square'; let hz=document.getElementById('hz').value; oscillator.frequency.setValueAtTime(hz, audioCtx.currentTime); oscillator.connect(audioCtx.destination); oscillator.start(); } }); //音を止める document.getElementById('stop').addEventListener('click',function(){ if(oscillator!==null){ oscillator.stop(); oscillator=null; } }); }); function setHz(hz){ document.getElementById('hz').value=hz; document.getElementById('hz_label').innerHTML=hz+'Hz'; if(oscillator!=null){ let hz=document.getElementById('hz').value; oscillator.frequency.setValueAtTime(hz, audioCtx.currentTime); } } </script>