只允许一个音频元素同时播放 [英] Only allow one audio element to play at a time

问题描述

我有多个音频播放器，每一个播放和停止按钮，一个页面上。我唯一​​的问题是，当你点击一个播放按钮，然后又在他们彼此顶部玩耍。有人可以帮助我的code，我需要停止一切正在播放的歌曲当另一个播放按钮被点击 - 所以永远不会有一个以上的歌曲播放一次？谢谢！这里是我的code：

  $（文件）。就绪（函数（）{
    $（＃播放BT）。点击（函数（）{
        $（＃音频播放机）[0] .play（）;
    }）    $（＃停止-BT）。点击（函数（）{
        $（＃音频播放机）[0] .pause（）;
        $（＃音频播放机）[0] .currentTime = 0;
    }）
}）
$（文件）。就绪（函数（）{
    $（＃戏-BT1）。点击（函数（）{
        $（＃音频PLAYER1）[0] .play（）;
    }）    $（＃停止-BT1）。点击（函数（）{
        $（＃音频PLAYER1）[0] .pause（）;
        $（＃音频PLAYER1）[0] .currentTime = 0;
    }）
}）
 

解决方案

  $（文件）。就绪（函数（）{    VAR allAudioEls = $（'声音'）;    功能pauseAllAudio（）{
       allAudioEls.each（函数（）{
          VAR一个= $（本）获得（0）;
          a.pause（）;
       }）;
    }
    $（＃播放BT）。点击（函数（）{
        pauseAllAudio（）;
        $（＃音频播放机）[0] .play（）;
    }）    $（＃停止-BT）。点击（函数（）{
        $（＃音频播放机）[0] .pause（）;
        $（＃音频播放机）[0] .currentTime = 0;
    }）    $（＃戏-BT1）。点击（函数（）{
        pauseAllAudio（）;
        $（＃音频PLAYER1）[0] .play（）;
    }）    $（＃停止-BT1）。点击（函数（）{
        $（＃音频PLAYER1）[0] .pause（）;
        $（＃音频PLAYER1）[0] .currentTime = 0;
    }）
}）
 

I have multiple audio players, each with a play and stop button, on one page. The only issue I have is when you click one play button, and then another, they play on top of one another. Can someone help me with the code I would need to stop whatever song is playing when another play button is clicked - so there would never be more than one song playing at a time?? Thanks! Here is my code:

$(document).ready(function(){ 
    $("#play-bt").click(function(){
        $("#audio-player")[0].play();
    })

    $("#stop-bt").click(function(){
        $("#audio-player")[0].pause();
        $("#audio-player")[0].currentTime = 0;
    })
})


$(document).ready(function(){
    $("#play-bt1").click(function(){
        $("#audio-player1")[0].play();
    })

    $("#stop-bt1").click(function(){
        $("#audio-player1")[0].pause();
        $("#audio-player1")[0].currentTime = 0;
    })
})

解决方案

$(document).ready(function(){ 

    var allAudioEls = $('audio');

    function pauseAllAudio() {
       allAudioEls.each(function() {
          var a = $(this).get(0);
          a.pause();
       });
    }


    $("#play-bt").click(function(){
        pauseAllAudio();
        $("#audio-player")[0].play();
    })

    $("#stop-bt").click(function(){
        $("#audio-player")[0].pause();
        $("#audio-player")[0].currentTime = 0;
    })

    $("#play-bt1").click(function(){
        pauseAllAudio();
        $("#audio-player1")[0].play();
    })

    $("#stop-bt1").click(function(){
        $("#audio-player1")[0].pause();
        $("#audio-player1")[0].currentTime = 0;
    })
})

这篇关于只允许一个音频元素同时播放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！