将Jquery Mobile脚本添加到标题时,“Media undefined”

时间:2013-06-14 14:39:47

标签: jquery-mobile header

我正在尝试开发一个简单的音频播放器。按照网络上的教程和stackoverflow,我能够使音频播放器工作。

工作(没有Jquery移动脚本标题):                 

    <title>Media Example</title>

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

    <script type="text/javascript" charset="utf-8">
    var my_media = null;
    // Wait for Cordova to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // Cordova is ready
    //
    function onDeviceReady() {


    }

    // Audio player

    // Play audio
    //
    function playAudio(src) {
       //some code here
    }

    // Pause audio
    // 
    function pauseAudio() {
    //some code here
    }

    // Stop audio
    // 
    function stopAudio() {
        //some code here

    }

    </script>

我在阅读本网站后所做的一项改进就是放置     var my_media = null; 在onDeviceReady()

之前

问题: 由于我想在Jquery Mobile中实现这个音频播放器,所以我将Jquery Mobile脚本添加到标题中,如下所示:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
              "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>

<script type="text/javascript" charset="utf-8" src="jquery/jquery-1.9.1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery/jquery.mobile-1.3.1.min.js"><script>
    <title>Media Example</title>

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

    <script type="text/javascript" charset="utf-8">
    var my_media = null;
    // Wait for Cordova to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // Cordova is ready
    //
    function onDeviceReady() {


    }

    // Audio player
    //
    // code truncated for simplicity

不幸的是,在添加Jquery移动脚本标题后,Eclipse日志显示:

Uncaught ReferenceError: Media is not defined 

所以,我怀疑问题是标题脚本启动顺序。 问题是,如何以及在何处插入Jquery Mobile脚本以使Phonegap媒体工作?

这个问题还有另一个问题,但仍然没有答案。感谢帮助。

修改 我已经追查了触发问题。显然,当我添加这个Jquery-mobile标题时

<script type="text/javascript" charset="utf-8" src="jquery/jquery.mobile-1.3.1.min.js"><script>

由于媒体未定义错误,音乐无法播放。

1 个答案:

答案 0 :(得分:1)

好吧,虽然没有直接的解决方案,但我从这里得到了灵感:jQuery Mobile & PhoneGap deviceReady() not fired

我的Jquery mobile + Phonegap音频播放器在以下修改后运行良好:

1)首先加载cordova.js

2)接下来是jquery mobile.css,jquery.js和jquery mobile.js

3)主要问题是,我认为,我将cordova射击过程与音频播放器的功能混合在一起。当我将cordova触发过程作为独立的块脚本和音频播放器功能分离为另一个脚本块时,它的工作非常出色。 以下是我的参考代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
              "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Media Example</title>


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

    <link rel="stylesheet" type="text/css" href="jquery/css/jquery.mobile-1.3.1.min.css"/>
    <script type="text/javascript" charset="utf-8" src="jquery/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="jquery/jquery.mobile-1.3.1.min.js"><script>

    <script type="text/javascript" charset="utf-8">// Wait for Cordova to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // Cordova is ready
    //
    function onDeviceReady() {


    }</script>

    //Cordova firing process and audio player function script declarations are separated. 

    <script type="text/javascript" charset="utf-8">



    // Audio player
    //
    var my_media = null;
    var mediaTimer = null;

    // Play audio
    //
    function playAudio(src) {
       //some code here


    }

    // Pause audio
    // 
    function pauseAudio() {
        //some code here
    }

    // Stop audio
    // 
    function stopAudio() {
       //some code here

    }

    </script>
  </head>

感谢您访问我的问题以及奥马尔的回复。