html - 在 HTML 5 中单击图像时添加声音

标签 html audio onclick mouse

我的 html 页面上有一张图片,我希望它在我点击它时播放声音效果。
这是图像代码:

<img src="images/button1.png" width="32" height="32" onclick="alert();">

我想将警报框更改为我加载的声音效果。我该怎么做?

最佳答案

好吧,这并不容易,实际上仅使用 HTML 很难完成。见 here更多细节。

您将面临各种问题,例如:

  • 不同的浏览器有不同的音频格式支持。
  • 如果浏览器
    不支持的文件格式,没有音频将无法播放
    插入。
  • 如果用户的电脑上没有安装插件,
    音频不会播放。
  • 如果将文件转换为其他格式,它
    仍然无法在所有浏览器中播放。

  • 使用超链接

    如果网页包含指向媒体文件的超链接,大多数浏览器将使用“帮助应用程序”来播放文件。

    以下代码片段显示了指向 mp3 文件的链接。如果用户单击该链接,浏览器将启动一个帮助应用程序来播放该文件:
    <a href="horse.mp3">Play the sound</a>
    

    我认为最好的解决方案是使用 Flash 播放声音,即将链接作为 Flash 对象/按钮/文本,并在 Adob​​e Flash 中悬停/单击/等时为它们分配声音。

    关于html - 在 HTML 5 中单击图像时添加声音,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12634862/

    相关文章:

    android - 使用 Superpowered sdk 静音左/右音频效果

    audio - 通过本地响应文件和URL播放音频

    android - 不使用 ViewPager 的 TabLayout

    jquery - 如何使用 jquery 获取子标签和父标签的 html 字符串?

    javascript - 使用 QueryLoader 插件时出现类型错误

    php - 面临将值放入聊天页面 php 的问题

    php - 我应该将表单和处理器写在同一个文件中还是将它们分开?

    javascript - 使用jquery和<audio>更改歌曲

    javascript - 如何检测用户何时单击网页选项卡?

    javascript - jQuery 点击跟踪不适用于 iFrame