2016-03-28 11 views
0

Gerçekten buna şaşırdım. Buradaki mantık, sayfada farklı ses öğeleriyle çalışan bir komut dosyası oluşturmaktır ve sınıfları ekleyerek/çıkararak OYNAT ve DURAKLAT düğmelerini değiştirir. İşe yaraması için ne değiştireceğine/ekleyeceğine dair bir fikriniz var. Herhangi bir şey belirlenecek! .Bir düğme üzerinde jquery ve javascript ile açma-kapama davranışı ekleme

<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> 
+0

Jquery kullanıcı arayüzünü kullanmak istediğinizden emin değilsiniz, ancak temelde bahsettiklerinizin bir örneğine sahiptirler [https://jqueryui.com/button/#toolbar](https://jqueryui.com/button/# toolbar) – David784

cevap

0

Eğer ('# duraklama düğmeli') $ denediniz gizlemek(); $ ('# play-button'). Show();

Bu, sınıfları kullanmaz ancak düğmelerin gizlenmesi ve gösterilmesi sorununu çözer gibi görünüyor.

+0

Hayır işe yaramıyor. – Vi0nik

İlgili konular