JQ和原生JS监听audio播放停止事件

发布时间:2020-07-03 10:28:36 作者:walkman2015
来源:网络 阅读:6236

原生JS:

function control_f(){
    var audio_f = document.getElementById('music_f');
    var audioimg_f = document.getElementById('audioimg_f');
    if(audio_f!==null){
        if(audio_f.paused){
            audio_f.play();
            audioimg_f.src=images[0];
        }else{
            audio_f.pause();
            audioimg_f.src=images[1];
        }
    }
        {//监听语音结束
    audio_f.addEventListener('ended', function () {
        audioEnded();
    }, false);

    function audioEnded() {
        audioimg_f.src=images[1];
    }

}

JQ:

  //语音试听按钮
        $('.ll-audio-btn').click(function () {
            var bb = $(this).siblings('.ll-audio')[0];
            if($(this).hasClass('open')){
                $(this).text('暂停');
                bb.play();
                $(this).removeClass('open');

            }else{
                $(this).addClass('open');
                $(this).text('试听');
                bb.pause();
            }

            (function($){//监听语音结束
                bb.addEventListener("ended",function(){
                    $(this).siblings('.ll-audio-btn').addClass('open');
                    $(this).siblings('.ll-audio-btn').text('试听');
                    bb.pause();
                },false);

            })(jQuery);

        });
推荐阅读:
  1. HTML5音频audio播放与暂停
  2. 关于项目中audio文件无法播放的报告

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

js audio j

上一篇:linux无法ping通外网怎么解决

下一篇:linux怎么实现清除屏幕

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》