Question

我没有Js专家所以我有点挣扎！我希望我能解释一下......

这是在PhoneGap app / iOS和Android中。

我有一个播放音频文件的链接：

<span class="play" onclick="loader(); playAudio('http://a797.phobos.apple.com/us/r30/Music/72/89/b9/mzi.aytblawp.aac.p.m4a','t3')"  id="t3">

因此，点击执行2个功能loader()即可实现“加载”功能。图标出现和＆＃34; playAudio＆＃34;播放曲目。

这是函数的js：

<script>
    function loader() {
        $(".loading").addClass("loadingnow");
    }
</script>

<script>
    function playAudio(src,trackname) {
        //  alert('trackname:' + trackname);
        if (audioPlaying === false) {
            if (device.platform == 'Android') {
                src = '/android_asset/www/' + src;
            }
            media = new Media(src, success, error_error);
            media.play();
            //add playing class
            document.getElementById(trackname).parentNode.className="playing";
            $(".loading").removeClass("loadingnow");
            audioPlaying = true;
        } else {
            //audio is already playing
        }
    }

    function success() {
        $(".playing").removeClass("playing");
        $(".loading").removeClass("loadingnow");
        audioPlaying = false;
    }

    function error_error(e) {
        //alert('great error');
        //alert(e.message);
    }

    function stopAudio() {
        if (media) {
            media.stop();
            audioPlaying = false;
        }
    }
</script>

音频加载有一点延迟 - 这就是为什么我有一个加载器图标出现但在应用程序中所有发生的是音频播放 - 加载器不会出现。（在播放音频时的playAudio函数中删除加载器）

如何使onlick执行加载器功能并确保在执行playAudio功能之前完成这些操作？！？!!

真的卡住!!

Answer 1

删除该行：

$(".loading").removeClass("loadingnow");

来自playAudio()。它应该只在success()函数中完成。

Answer 2

不确定这是根本原因，但也许您应该删除下面的注释行：

function playAudio(src,trackname) {
    //  alert('trackname:' + trackname);
    if (audioPlaying === false) {
        if (device.platform == 'Android') {
            src = '/android_asset/www/' + src;
            }
            media = new Media(src, success, error_error);
            media.play();
            //add playing class
            document.getElementById(trackname).parentNode.className="playing";
           // $(".loading").removeClass("loadingnow");  <------ this line removes immediately the class. The sucess function will do this, once the media is loaded 
            audioPlaying = true;
            } else {
            //audio is already playing
        }
    }

Answer 3

首先将其拉入JS文件 - 没有人喜欢内联JS ......

第二个具有触发它们的功能

<强> HTML

<span class="play" onclick="loadPlay('http://a797.phobos.apple.com/us/r30/Music/72/89/b9/mzi.aytblawp.aac.p.m4a','t3')"  id="t3">

<强> JS

<script>
   function loadPlay(src, trackName) {
       loader();
       playAudio(src, trackName);
   }

   function loader() {
        $(".loading").addClass("loadingnow");
    }

    function playAudio(src,trackname) {
        //  alert('trackname:' + trackname);
        if (audioPlaying === false) {
            if (device.platform == 'Android') {
                src = '/android_asset/www/' + src;
            }
            media = new Media(src, success, error_error);
            media.play();
            //add playing class
            document.getElementById(trackname).parentNode.className="playing";
            audioPlaying = true;
        } else {
            //audio is already playing
        }
    }

    function success() {
        $(".playing").removeClass("playing");
        $(".loading").removeClass("loadingnow");
        audioPlaying = false;
    }

    function error_error(e) {
        //alert('great error');
        //alert(e.message);
    }

    function stopAudio() {
        if (media) {
            media.stop();
            audioPlaying = false;
        }
    }
</script>

我的onlick有两个功能 - 但是我需要一个接一个发射？

3 个答案: