如何让JavaScript发出哔哔声?

我想我的网页哔哔每当用户超过我的<textarea>的最大字符限制。

当前回答

使用CSS，你可以这样做，如果你添加以下样式的标签，但你需要一个wav文件:

<style type="text/css">
        .beep {cue: url("beep.wav") }
</style>

var body=document.getElementByTagName("body");
body.className=body.className + " " + "beep";

2011-01-07 20:10:21

其他回答

该代码支持多个哔哔声的排序，以及频率的逐渐变化('ramp'标志)。下面给出了两个例子。

<script>
var audioContext = null;
var oscillatorNode = null;
var stopTime = 0;

function beep (frequency, durationSec, ramp=false)
{
    if (oscillatorNode == null) {
        audioContext = new (window.AudioContext || window.webkitAudioContext) ();
        stopTime = audioContext.currentTime;

        oscillatorNode = audioContext.createOscillator();
        oscillatorNode.type = "sine";
        oscillatorNode.connect (audioContext.destination);
        if (ramp) {
            oscillatorNode.frequency.setValueAtTime (frequency, stopTime);
        }
        oscillatorNode.start ();
        oscillatorNode.onended = function() {
            oscillatorNode = null;
            audioContext = null;
        }
    }

    if (ramp) {
        oscillatorNode.frequency.linearRampToValueAtTime (frequency, stopTime); // value in hertz
    } else {
        oscillatorNode.frequency.setValueAtTime (frequency, stopTime);  // value in hertz
    }

    stopTime += durationSec;
    oscillatorNode.stop (stopTime);
}
function test1()
{
        beep (250, 0.5);
        beep (1000, 0.2);
        beep (550, 0.5);
}
    
function test2()
{
        beep (50, 2, true);
        beep (5000, 2, true);
        beep (50, 0, true);
}
</script>
    
<button onclick='test1()'>Beep!</button>
<button onclick='test2()'>Beep(ramped)!</button>

2021-06-14 10:34:47

<html>
<head>
    <script src='https://surikov.github.io/webaudiofont/npm/dist/WebAudioFontPlayer.js'></script>
    <script src='https://surikov.github.io/webaudiofontdata/sound/0000_JCLive_sf2_file.js'></script>
    <script>
        var selectedPreset=_tone_0000_JCLive_sf2_file;
        var AudioContextFunc = window.AudioContext || window.webkitAudioContext;
        var audioContext = new AudioContextFunc();
        var player=new WebAudioFontPlayer();
        player.loader.decodeAfterLoading(audioContext, '_tone_0000_JCLive_sf2_file');
    </script>
</head>
<body>
    <p><a href="#" onmousedown="player.queueWaveTable(audioContext, audioContext.destination, selectedPreset, 0, 55, 3.5);">Play a note</a></p>
    <hr/>
    <p><a href="https://github.com/surikov/webaudiofont">source</a></p>
</body>

听这里 https://jsbin.com/lamidog/1/edit?html,output

2020-01-31 08:32:03

以下是我如何使用HTML5让它发出哔哔声: 首先我复制并将windows wav文件转换为mp3，然后我使用以下代码:

var _beep = window.Audio("Content/Custom/Beep.mp3")

function playBeep() { _beep.play()};

全局声明声音文件并在需要时引用它会更快。

2014-02-28 16:01:41

您需要从某个地方提供声音文件。以下是来自Scriptaculous的Sound库的代码:

//Default:
<embed style="height:0" id="sound_#{track}_#{id}" src="#{url}" loop="false" autostart="true" hidden="true"/>

//For Gecko:
if(Prototype.Browser.Gecko && navigator.userAgent.indexOf("Win") > 0){
  if(navigator.plugins && $A(navigator.plugins).detect(function(p){ return p.name.indexOf('QuickTime') != -1 }))
    Sound.template = new Template('<object id="sound_#{track}_#{id}" width="0" height="0" type="audio/mpeg" data="#{url}"/>');
  else if(navigator.plugins && $A(navigator.plugins).detect(function(p){ return p.name.indexOf('Windows Media') != -1 }))
    Sound.template = new Template('<object id="sound_#{track}_#{id}" type="application/x-mplayer2" data="#{url}"></object>');
  else if(navigator.plugins && $A(navigator.plugins).detect(function(p){ return p.name.indexOf('RealPlayer') != -1 }))
    Sound.template = new Template('<embed type="audio/x-pn-realaudio-plugin" style="height:0" id="sound_#{track}_#{id}" src="#{url}" loop="false" autostart="true" hidden="true"/>');
  else
    Sound.play = function(){};
}

2009-05-18 18:44:41

注意:把这段代码放在你想要出现哔哔声的地方。并且记住指定存储哔哔声的目录或文件夹(源)。

<script>
//Appending HTML5 Audio Tag in HTML Body
$('<audio id="chatAudio"><source src="sound/notify.ogg" type="audio/ogg"><source src="sound/notify.mp3" type="audio/mpeg"><source src="sound/notify.wav" type="audio/wav"></audio>').appendTo('body');

$('#chatAudio')[0].play();
</script>

参考:http://www.9lessons.info/2013/04/play-notification-sound-using-jquery.html。

我在我正在开发的社交媒体中实现了这一点，它的工作发现，聊天时像facebook一样的通知，通知你有一个新的聊天消息

2015-04-08 14:37:25

如何让JavaScript发出哔哔声?

推荐文章

最新文章

标签