jqueryとjavascriptを使ったボタンのオンオフ動作の追加

Question

私は本当にこれに固執しています。ここでのロジックは、ページ上のさまざまなオーディオ要素で動作するスクリプトを1つ作成し、クラスを追加/削除することによってPLAYボタンとPAUSEボタンを切り替えます。どのようなアイデアを変更/追加するには、それを動作させるために。何かがappriciatedされます！ 。

<audio id="arbeiten" preload="none"> 
    <source src="../../../audio/sound1.mp3" type="audio/mpeg">Your browser does not support the audio element. 
</audio> 

<button id="play-button" class="btn btn-xs" data-action="play" data-target="#arbeiten"> 
     Play 
</button> 
<button id="pause-button" class="btn btn-xs hide" data-action="pause" data-target="#arbeiten"> 
    Pause 
</button> 

<script> 
    $('body').on('click','[data-action]',function() { 
     var action = $(this).data('action'); 
     var target = $(this).data('target'); 
     switch(action) { 
      case 'play': 
       $(target)[0].play(); 
       $(target).addClass("hide"); 
       $(this).removeClass('hide'); 
       break; 
      case 'pause': 
       $(target)[0].pause(); 
       $('#pause-button').addClass("hide"); 
       $('#play-button').removeClass('hide'); 
       break; 
     } 
     console.log('Called action ',action,' on element ',target); 
    }); 

</script> 

Answer 1

は、あなたが（ '＃一時停止ボタン'） $を試してみました隠します（）; $（ '＃再生ボタン'）。show（）;

クラスを使用していませんが、ボタンを隠したり表示したりする問題を解決しているようです。