Question

我有一个播放和停止视频的按钮。如何有效地在.play（）和.pause（）之间切换？

<button id="thebutton" onclick="BV.getPlayer().play();"></button>

Answer 1

首先，我建议使用内联事件处理程序 not 。如果您正在使用jQuery，那么我建议您使用它。

每次点击后，设置一个变量来判断它是否正在播放，然后触发正确的动作。

$(function(){
    $('#thebutton').click(function(){
        var isPlaying = $(this).data('isplaying');

        if(isPlaying){
            BV.getPlayer().pause();
        }
        else{
            BV.getPlayer().play();
        }

        $(this).data('isplaying', !isPlaying);
    });
});

_{jQuery曾经有一个.toggle() "event"，但它已被删除。}

Answer 2

添加一个用作检查玩家状态的类。然后使用此代码。

$("#theButton").click(function() {
    if($(this).hasClass('playing')) {
        BV.getPlayer().pause();   
    } else {
        BV.getPlayer().play();
    }
    $(this).toggleClass('playing')
})

Answer 3

$('#thebutton').click(function() {

if ($(this).val() == "play") {
  $(this).val("pause");
  play_int();
}

else {
  $(this).val("play");
 play_pause();
 }         
});

或

 $(function(){
$('#play').click(function() {
   // if the play button value is 'play', call the play function
   // otherwise call the pause function
   $(this).val() == "play" ? play_int() : play_pause();
});
});

function play_int() {
$('#play').val("pause");
// do play
}

function play_pause() {
$('#play').val("play");
// do pause
}

又名 jquery toggle button value

Answer 4

var isPlaying = false;
var player = BV.getPlayer();
$("#thebutton").click(function() {
    if (isPlaying) {
        player.pause();
        isPlaying = false;
    } else {
        player.play();
        isPlaying = true;
    }
});

如何为按钮切换onclick =“function”

4 个答案: