Benzersiz bir işlev kullanarak özel işlev adı

Question

Tek sayfada çok sayıda HTML5 ses oynatıcısı kullanıyorum ve bunları ayrı ayrı denetlemenin bir yoluna ihtiyacım var. Şimdiye kadar kullanmış olduğum benzersiz bir numara oluşturmak için

.

function play() { document.getElementById('player-<?php echo $unique; ?>').play(); } 

Sorum, nerede benim tektir şu şekildedir: Ben işlev içinde, bazı jQuery içinde bu uygulayabilirim

<button class="bb-play" onClick="play-<?php echo $unique; ?>()">Play</button> 

: Onları başarıyla benim oyuncuya bu uygulamak mümkün olmuştur numara 56f295fbe6be3 nasıl() yerine play-56f295fbe6be3() olarak görünmesini fonksiyonu dinleme hakkı elde alabilirim demek olduğunu?

Verebileceğiniz herhangi bir yardımı takdir ediyorum.

Answer 1

HTML:

<button class="bb-play" onClick="play(<?php echo $unique; ?>);">Play</button> 

JavaScript:

function play(id) { document.getElementById('player-'+id).play(); } 

Answer 2

adında benzersiz bir sayı olan bir işlev Yazmaya çalışıyorum kötü bir yaklaşımdır. Hepsini işleyebilecek benzersiz bir işlev yazmayı tercih etmelisiniz. Bir semantik bakış açısıyla

<script> 
    function play(that) { 
     var playerId = that.id; 
     document.getElementById('player-' + playerId).play(); 
    } 
</script> 
<button class="bb-play" id="<?php echo $unique; ?>" onClick="play(this)">Play</button> 

, biz <button> elemana oyuncu kimliği ve o daha mantıklı bir özeliikten içine koymak yapmak ne diyor bir öznitelik atama ediyoruz. Daha sonra jQuery kullanımı daha kolay gelir:

<button class="bb-play" data-player-id="player-<?php echo $unique; ?>">Play</button> 

<script> 
    $("button.bb-play").click(function(){ 
     var playerId = $(this).data('playerId'); 
     $("#" + playerId).play(); 
    }); 
</script> 

Answer 3

düğmeleri ve oyuncu aynı ana öğesi içinde yerlerdir varsa, kimliği yıllardan olmadan işe yarayabilir.

<div class="player"> 
    <media .../> 
    <button class="bb-play">Play</button> 
</div> 

ve js kodu

$('.bb-play').on('click', function() { 
    $('media', $(this).closest('.player')).get(0).play(); 
}); 

Answer 4

Neden işleve bir değişken olarak kimlik numarasını geçemiyor?

function play_video(id) { 
    document.getElementById('video-' + id).play(); 
} 

Ve HTML kullanımda

:

onClick="play_video(<?php echo $unique; ?>)" id="video-<?php echo $unique; ?>" 

// onClick="play_video(56f295fbe6be3)" id="56f295fbe6be3" 

Sonra sadece tüm videolar için play_video() kullanabilirsiniz.