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

原生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);

        });

转载于:https://blog.51cto.com/11052360/2320335

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值