Question

我有一个来自youtube api的背景视频，但是我不能从声音开始。我使用.trigger和.click进行了测试，但无法正常工作。你知道我能做什么吗？

    $(document).ready(function(e) {   
  $('.sound').on('click', function(){
    $('#video-foreground').toggleClass('mute');
    $('.volume-icon').toggleClass('fa-volume-up', 'fa-volume-off');
    if($('#video-foreground').hasClass('mute')){
      player.mute();
    } else {
      player.unMute();
    }
  });
});


  $( document ).ready(function() {
  $('.sound').click(); 


  });

感谢您的帮助。

Answer 1

根据文档，您将必须通过api初始化播放器，并将onReady事件处理程序作为参数传递。

var player;

function onYouTubeIframeAPIReady() {
    player = new YT.Player('ytplayer', {
        events: {
            'onReady': onPlayerReady
        }
    });
}

function onPlayerReady(event) {
    player.mute();
    player.playVideo();
}

$(document).ready(function(e) { 
    $('.sound').on('click', function(){
        $('#video-foreground').toggleClass('mute');
        $('.volume-icon').toggleClass('fa-volume-up', 'fa-volume-off');
        if ($('#video-foreground').hasClass('mute')){
            player.mute();
        } else {
            player.unMute();
        }
    });
});

其中ytplayer是iframe id

Answer 2

完整脚本。
当声音开始时，它指示错误。有必要以静音启动并激活它已经可以工作，可以手动激活它，但是这个想法是自动激活它

<script >var player; 

function onYouTubeIframeAPIReady() {
  player = new YT.Player('video-foreground', {
    videoId: 'bz8ko0wroJQ', // YouTube Video ID
    playerVars: {
      autoplay: 1,       
      controls: 0,        
      showinfo: 0,       
     rel:0,
      modestbranding: 1,  
      loop: 1,            
      fs: 0,              
      cc_load_policy: 0, 
      iv_load_policy: 3,  
      autohide: 0,         
      playlist: 'PLR5MgzxY6DoGXL77i0as2_rKS3aEDcx_R'
    },
    events: {
      'onReady': onready1,
      'onStateChange': onchange2
      }

  });
}

 function onready1(e) {   
        e.target.mute();

}

 function onchange2(e) {   
        if (e.data === YT.PlayerState.ENDED) {
            player.playVideo(); 
        }
 }

$(document).ready(function(e) {   
  $('.sound').on('click', function(){
    $('#video-foreground').toggleClass('mute');
    $('.volume-icon').toggleClass('fa-volume-up', 'fa-volume-off');
    if($('#video-foreground').hasClass('mute')){
      player.mute();
    } else {
      player.unMute();
    }
  });
});

</script>

jQuery .on（click）寻找触发器

2 个答案: