使用phonegap为Android播放多个mp3文件

Question

I'm trying to write an Android app with PhoneGap that contains multiple HTML files. 我正在尝试使用包含多个HTML文件的PhoneGap编写Android应用程序。 In every HTML I would like to include an mp3 file that the user can play and stop. 在每个HTML中，我想包含一个用户可以播放和停止的mp3文件。 This has worked so far. 到目前为止这已经奏效了。 The problem that I encounter is when trying to put multiple mp3 files in one file. 我遇到的问题是尝试将多个mp3文件放在一个文件中。

The thing that I would like to achieve is to put the general audio player javescript in one file and to tell in the HTML which file should be played. 我想要实现的是将通用音频播放器javescript放在一个文件中，并在HTML中告诉应该播放哪个文件。 Is this possible and how? 这可能吗？怎么样？ Thanks! 谢谢！

My code for one of the html files looks like this: 我的一个html文件的代码如下所示：

    <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
<script type="text/javascript" charset="utf-8">

//-------------------------------------------------------------------------
// Audio player
//-------------------------------------------------------------------------
var media1 = null;
var media1Timer = null;
var audioSrc = null;

/**
 * Play audio
 */
function playAudio(url) {
    console.log("playAudio()");
    console.log(" -- media="+media1);

    //var src = "/android_asset/www/audio/01.mp3";
    var src = "/android_asset/www/audio/01.mp3";
    if (url) {
        src = url;
    }

    // Stop playing if src is different from currently playing source
    if (src != audioSrc) {
        if (media1 != null) {
            stopAudio();
            media1 = null;
        }
    }

    if (media1 == null) {


        media1 = new Media(src,
            function() {
                console.log("playAudio():Audio Success");
            },
            function(err) {
                console.log("playAudio():Audio Error: "+err);
                setAudioStatus("Error: " + err);
            },
            function(status) {
                console.log("playAudio():Audio Status: "+status);
                setAudioStatus(Media.MEDIA_MSG[status]);

                // If stopped, then stop getting current position
                if (Media.MEDIA_STOPPED == status) {
                    clearInterval(media1Timer);
                    media1Timer = null;
                }
            });
    }
    audioSrc = src;

    // Play audio
    media1.play();
    if (media1Timer == null) {
        media1Timer = setInterval(
            function() {
                media1.getCurrentPosition(
                    function(position) {
                        console.log("Pos="+position);
                        if (position > -1) {
                            setAudioPosition((position/1000)+" sec");
                        }
                    },
                    function(e) {
                        console.log("Error getting pos="+e);
                        setAudioPosition("Error: "+e);
                    }
                );
            },
            1000
        );
    }

    // Get duration
    var counter = 0;
    var timerDur = setInterval(
        function() {
            counter = counter + 100;
            if (counter > 2000) {
                clearInterval(timerDur);
            }
            var dur = media1.getDuration();
            if (dur > 0) {
                clearInterval(timerDur);
                document.getElementById('audio_duration').innerHTML = (dur/1000) + " sec";
            }
        }, 100);
}

/**
 * Pause audio playback
 */
function pauseAudio() {
    console.log("pauseAudio()");
    if (media1) {
        media1.pause();
    }
}

/**
 * Stop audio
 */
function stopAudio() {
    console.log("stopAudio()");
    if (media1) {
        media1.stop();
    }
    clearInterval(media1Timer);
    media1Timer = null;
}

/**
 * Set audio status
 */
var setAudioStatus = function(status) {
    document.getElementById('audio_status').innerHTML = status;
};

/**
 * Set audio position
 */
var setAudioPosition = function(position) {
    document.getElementById('audio_position').innerHTML = position;
};
   </script>
  </head>
  <body>
    <!-- Audio -->
<div id="info">
    <h2>Audio</h2>
</div>
<a href="#" class="btn large" onclick="playAudio();">Play</a>
<a href="#" class="btn large" onclick="pauseAudio();">Pause</a>
<a href="#" class="btn large" onclick="stopAudio();">Stop</a>
  </body>

Answer 1

You might consider using a page with a frame on it. 您可以考虑使用带有框架的页面。 Place your common javascript in the of the main page and then call back to parent.playAudio(src) to kick off the player from each sub-page as it's loaded into the frame. 将您的常用javascript放在主页面中，然后回调到parent.playAudio（src），以便在每个子页面加载到帧中时启动播放器。

Another possible direction is use of jqMobile. 另一个可能的方向是使用jqMobile。 By default, jqMobile loads pages using Ajax calls..consequently, your javascript can be loaded by the very first page only...and all subsequent page loads via ajax do not totally replace the DOM...leaving your javascript in tact. 默认情况下，jqMobile使用Ajax调用加载页面。因此，您的javascript只能由第一页加载...并且所有后续页面通过ajax加载并不能完全取代DOM ...让您的javascript保持畅销。 I have developed a small app using phonegap and jqMobile with fairly good success. 我开发了一个使用phonegap和jqMobile的小应用程序，取得了相当不错的成功。

使用phonegap为Android播放多个mp3文件

问题描述

1 个解决方案

解决方案1
0 2011-10-11 23:44:36

使用phonegap为Android播放多个mp3文件

问题描述

1 个解决方案

解决方案1 0 2011-10-11 23:44:36

解决方案1
0 2011-10-11 23:44:36