Имя пользовательской функции с использованием уникального номера

Я использую несколько аудиоплееров HTML5 на одной странице, и мне нужны средства для их индивидуального управления. Я до сих пор использовал:

<?php $unique = uniqid(); ?>

сгенерировать уникальный номер. Я им удалось успешно применить это к моему игроку:

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

Я могу применить это в некотором jQuery, в функции следующим образом:

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

Мой вопрос, где мой уникальный номер сказать 56f295fbe6be3 как я могу получить функцию играть() вместо этого появиться как играть-56f295fbe6be3 () ?

Я ценю любую помощь, которую вы можете оказать.

1

Решение

Попытка написать функцию с уникальным номером в названии — плохой подход. Вы должны написать уникальную функцию, которая может обрабатывать их все.

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

С семантической точки зрения мы присваиваем <button> элемент атрибут, который говорит, что такое идентификатор игрока, и было бы более целесообразно поместить его в атрибут данных. Тогда проще использовать jQuery:

<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>
1

Другие решения

HTML:

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

Javascript:

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

Если кнопки и проигрыватель находятся внутри одного и того же родительского элемента, вы можете работать без идентификаторов.

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

и код JS

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

Почему бы не передать номер идентификатора в качестве переменной функции?

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

А в HTML используйте:

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

Тогда вы можете просто использовать play_video() для всех видео.

0
По вопросам рекламы [email protected]