2

我刚刚开始使用 JQuery 和 SoundManger2，我注意到 SoundManager 在某些使用 JQuery 的情况下存在问题。它还取决于使用的是 Firefox (3.6.13) 还是 IE(8.0.7600)。

我要测试的只是天气我可以播放声音还是不播放。在每个示例中，我将首先显示代码，然后在代码之后确定 IE 和 FireFox 是成功还是失败。

<html> 
<head>
    <title></title>
    <script type="text/javascript" src="/Project/PublicWebSite/Scripts/soundmanager2.js"></script>
    <script type="text/javascript" src="/Project/PublicWebSite/Scripts/jquery-1.5.js"></script>    
    <script type="text/javascript">
        soundManager.debugMode = true;
        soundManager.defaultOptions.volume = 50
        soundManager.debugFlash = true; // enable flash debug output for this page
        soundManager.url = '/Project/PublicWebSite/Scripts/swf/soundmanager2.swf';
        soundManager.flashVersion = 8; // optional: shiny features (default = 8)
        soundManager.useFlashBlock = false; // optionally, enable when you're ready to dive in
        //enable HTML5 audio support, if you're feeling adventurous. iPad/iPhone will always get this.
        //soundManager.useHTML5Audio = true;
        soundManager.onready(function () {
            soundManager.createSound('helloWorld', '/Project/PublicWebSite/Content/Sounds/Chime.mp3');
            soundManager.play('helloWorld');
        });
    </script>
</head>
<body>
</body>
</html>

即：成功；火狐：成功

在下面的代码中，除了我在 JQuery 文档加载中添加 SoundManager 的配置之外，一切都是一样的。

<html> 
<head>
    <title></title>
    <script type="text/javascript" src="/Project/PublicWebSite/Scripts/soundmanager2.js"></script>
    <script type="text/javascript" src="/Project/PublicWebSite/Scripts/jquery-1.5.js"></script>    
    <script type="text/javascript">

        $(function () {
            soundManager.debugMode = true;
            soundManager.defaultOptions.volume = 50
            soundManager.debugFlash = true; // enable flash debug output for this page
            soundManager.url = '/Project/PublicWebSite/Scripts/swf/soundmanager2.swf';
            soundManager.flashVersion = 8; // optional: shiny features (default = 8)
            soundManager.useFlashBlock = false; // optionally, enable when you're ready to dive in
            //enable HTML5 audio support, if you're feeling adventurous. iPad/iPhone will always get this.
            //soundManager.useHTML5Audio = true;
            soundManager.onready(function () {
                soundManager.createSound('helloWorld', '/Project/PublicWebSite/Content/Sounds/Chime.mp3');
                soundManager.play('helloWorld');
            });
        });
    </script>
</head>
<body>
</body>
</html>

即：成功；火狐：失败

更改了 JQuery 和 SoundManger 脚本引用的顺序

<html> 
<head>
    <title></title>
    <script type="text/javascript" src="/Project/PublicWebSite/Scripts/jquery-1.5.js"></script>    
    <script type="text/javascript" src="/Project/PublicWebSite/Scripts/soundmanager2.js"></script>
    <script type="text/javascript">

        $(function () {
            soundManager.debugMode = true;
            soundManager.defaultOptions.volume = 50
            soundManager.debugFlash = true; // enable flash debug output for this page
            soundManager.url = '/Project/PublicWebSite/Scripts/swf/soundmanager2.swf';
            soundManager.flashVersion = 8; // optional: shiny features (default = 8)
            soundManager.useFlashBlock = false; // optionally, enable when you're ready to dive in
            //enable HTML5 audio support, if you're feeling adventurous. iPad/iPhone will always get this.
            //soundManager.useHTML5Audio = true;
            soundManager.onready(function () {
                soundManager.createSound('helloWorld', '/Project/PublicWebSite/Content/Sounds/Chime.mp3');
                soundManager.play('helloWorld');
            });
        });
    </script>
</head>
<body>
</body>
</html>

即：失败；火狐：成功

如果我所做的只是制作静态网页，这将不是问题。我正在使用层等在 asp.net MVC 中创建代码，加载的顺序很重要。这就是我最初偶然发现这个问题的方式。

因为我是 JQuery 和 SoundManger 的菜鸟，所以很有可能我做错了什么。如果有人对如何更好地做到这一点有任何意见，我会提出任何答案。在我弄清楚这一点并希望这对其他人有所帮助之前，我将头撞在键盘上很长一段时间。

更新

当声音不播放时，我从 SoundManager2 获得以下信息

-- SoundManager 2 加载失败（安全/加载错误） --
soundManager.disable(): 关闭
soundManager: 初始化失败。
soundManager：验证 /Project/PublicWebSite/Scripts/swf/soundmanager2.swf 是有效路径。
soundManager：在预期时间内没有 Flash 响应。可能的原因：加载 soundmanager2_debug.swf 可能失败（和/或 Flash 8+ 不存在？）、Flash 被阻止或 JS-Flash 安全错误。有关更多调试信息，请参阅 SWF 输出。
soundManager: 不耐烦了，还在等待 Flash...
soundManager::initMovie(): 等待来自 Flash 的 ExternalInterface 调用..
soundManager::initMovie(): 得到 EMBED 元素（通过 JS 创建）
soundManager::createMovie(): 正在尝试加载 ./soundmanager2_debug.swf
-- SoundManager 2 V2.97a.20110123 (AS2/Flash 8)，正常轮询 --

我在 Firebug 和 Fiddler 中注意到，当我收到此错误时，SoundManger 会尝试查找 soundmanager2_debug.swf @/project/PublicWebSite/static/。问题是我的 swf 文件不在那里。这是我的 HTML 文件所在的位置。

更新

西蒙，这为我指明了正确的方向。如http://www.schillmania.com/projects/soundmanager2/doc/getstarted/#lazy-loading所述，我不必更改 soundmanger2.js 文件中的任何内容。
我只是删除了对 SoundManger 脚本的引用，并使用 JQuery ajax 调用动态加载了脚本。

<html> 
<head>
    <title></title>
    <script type="text/javascript" src="/Project/PublicWebSite/Scripts/jquery-1.5.js"></script>    

    <script type="text/javascript">

        $(function () {
            $.ajax({
                url: '/Project/PublicWebSite/Scripts/soundmanager2.js',
                dataType: 'script',
                success: 
                {
                    soundManager.debugMode = true;
                    soundManager.defaultOptions.volume = 50
                    soundManager.debugFlash = true; // enable flash debug output for this page
                    soundManager.url = '/Project/PublicWebSite/Scripts/swf/soundmanager2.swf';
                    soundManager.flashVersion = 8; // optional: shiny features (default = 8)
                    soundManager.useFlashBlock = false; // optionally, enable when you're ready to dive in
                    //enable HTML5 audio support, if you're feeling adventurous. iPad/iPhone will always get this.
                    //soundManager.useHTML5Audio = true;
                    soundManager.onready(function () {
                        soundManager.createSound('helloWorld', '/Project/PublicWebSite/Content/Sounds/Chime.mp3');
                        soundManager.play('helloWorld');
                    });
                }

            });

        });
    </script>
</head>
<body>
</body>
</html>

即：成功；火狐：成功

巴德开发

4

2 回答 2

3

这里的问题不是特别是使用 jquery，而是您将 Soundmanager2 的配置绑定到 DOM-ready 事件这一事实。Soundmanager2 本身也将其加载例程绑定到此事件，因此如果您的配置代码在此事件发生之前未执行，则可能已经为时已晚，具体取决于浏览器调用这些事件处理程序的顺序。

我不是 SM2 专家（从未使用过），但我刚刚偶然发现了管理器的“延迟加载”功能，这可能会有所帮助，因为它应该允许您推迟 Soundmanager2 的加载过程并在您之后显式加载它配置代码已被调用： http ://www.schillmania.com/projects/soundmanager2/doc/getstarted/#lazy-loading

于 2011-02-15T08:58:51.210 回答
0

我最近发布了一个音频播放器框架，它利用 SoundManager2 并将 w/jQuery 集成为 $.fn。-- 使用和/或自定义非常简单.. 类似于前端设计中的 jPlayer，但具有额外的播放功能（例如 RTMP 流、完整的 HTML5 支持）、示例、测试等：

https://github.com/APMG/APMPlayer

于 2013-01-09T02:29:55.860 回答