MouseOver 音效，比这更好的方法答案

【问题标题】：MouseOver sound effect, a Better way than thisMouseOver 音效，比这更好的方法
【发布时间】：2013-05-08 17:14:40
【问题描述】：

我需要鼠标悬停事件的声音，我有这种方式，但它的问题来自鼠标悬停和声音播放之间的延迟，这是由于（我认为）代码上的嵌入声音处理。我想知道是否有更好的方法使用 js/jquery）。但不是我不想在这种特殊情况下实现的新 html5 音频标签。

一个 ajax 调用加载文件，然后我在 mouseOver 上附加了一个名为 playSound() 的函数

function playSound()
{ 
  $setSound = document.getElementById("soundWrapper").innerHTML="<embed id='sound' src='href' type=audio/mpeg hidden=false autostart=true volume=12>";
}

然后在 mouseOut 事件中调用一个名为 stopSound() 的函数

function stopSound()
{
  $stopSound = document.getElementById("soundWrapper").innerHTML="";
}

没什么花哨的，但它确实有效。所说的问题是播放声音的延迟。有没有办法播放/停止已经嵌入的声音，而不仅仅是每次都嵌入一个新的，或者类似的东西？

感谢您的时间和帮助。问候。

【问题讨论】：

您是否考虑过使用Audio 对象？还是将 HTML5 音频元素插入 DOM？
使用<audio> 元素并将其隐藏在页面上。当你想播放它的声音时，在它的元素引用上调用.play()。 developer.mozilla.org/en-US/docs/HTML/Element/audio

标签： javascript jquery audio mouseover

【解决方案1】：

如果您的 AJAX 将音频标签 (http://www.w3schools.com/tags/tag_audio.asp) 加载到所需位置，您可以使用 JS 中的 .play() 方法播放它。然后就变得很简单了

$(YOURMOUSEOVERELEMENT).on('mouseover', function(){$('#sound').play()});

那么如果你想在鼠标离开时停止音频：

$(YOURMOUSEOVERELEMENT).on('mouseout', function(){$('#sound').stop()});

【讨论】：

感谢您的回复，但他们都使用音频标签（HTM5），IE 不支持。除了音频标签还有其他方法吗？在这种特殊情况下，我需要它在 IE8 中像在任何其他现代浏览器中一样运行。感谢您提供更多信息。
您可以将其更改为$(YOURMOUSEOVERELEMENT).on('mouseover', function(){$('#soundWrapper').html('<embed id='sound' src='href' type=audio/mpeg hidden=false autostart=true volume=12>')});，然后将其停止为$(YOURMOUSEOVERELEMENT).on('mouseover', function(){$('#soundWrapper').html('')});
抱歉，停止播放的第二位应该是$(YOURMOUSEOVERELEMENT).on('mouseout', function(){$('#soundWrapper').html('')});