html5 аудиоплеер - jquery переключить воспроизведение / пауза?

Question

Интересно, что я делаю не так?

    $('.player_audio').click(function() {
    if ($('.player_audio').paused == false) {
        $('.player_audio').pause();
        alert('music paused');
    } else {
        $('.player_audio').play();
        alert('music playing');
    }
});

Не получается запустить звуковую дорожку, если я нажму на тэг player_audio.

<div class='thumb audio'><audio class='player_audio' src='$path/$value'></audio></div>

есть идеи, что я делаю неправильно или что мне нужно сделать, чтобы это заработало?

Answer 1

Вот мое решение (если вы хотите щелкнуть другой элемент на странице):

$("#button").click(function() {
        var bool = $("#player").prop("muted");
        $("#player").prop("muted",!bool);
        if (bool) {
            $("#player").prop("currentTime",0);
        }
});

Answer 2

Причина , почему ваша попытка не удалась, заключается в том, что вы использовали селектор классов, который возвращает коллекцию элементов, а не и (= один!) элемент, который вам нужен для доступа к свойствам и методам игроков. Чтобы заставить его работать, есть три основных способа, которые были упомянуты, но только для обзора:

Получить элемент, а не коллекцию, по ...

• Итерация по сбору и извлечению элемента с this (как в принятом ответе).

• Использование идентификатора, если он доступен.

• Получение элемента коллекции путем его выборки через его положение в коллекции путем добавления [0] к селектору, который возвращает первый элемент коллекции.

Answer 3

Вот мое решение с использованием jQuery

<script type="text/javascript">
    $('#mtoogle').toggle(
        function () {
            document.getElementById('playTune').pause();
        },
        function () {
            document.getElementById('playTune').play();
        }
    );
</script>

И рабочая демка

http://demo.ftutorials.com/html5-audio/

Answer 4

, если у кого-то еще есть проблемы с вышеупомянутыми решениями, я заканчиваю тем, что просто иду на событие:

$("#jquery_audioPlayer").jPlayer({
    ready:function () {
        $(this).jPlayer("setMedia", {
            mp3:"media/song.mp3"
        })
        ...
    pause: function () {
      $('#yoursoundcontrol').click(function () {
            $("#jquery_audioPlayer").jPlayer('play');
      })
    },
    play: function () {
    $('#yoursoundcontrol').click(function () {
            $("#jquery_audioPlayer").jPlayer('pause');
    })}
});

работает для меня.

Answer 5

Я сделал это внутри гармошки jQuery.

$(function() {
        /*video controls*/
            $("#player_video").click(function() {
              if (this.paused == false) {
                  this.pause();
              }
            });
        /*end video controls*/

        var stop = false;
        $("#accordion h3").click(function(event) {
            if (stop) {
                event.stopImmediatePropagation();
                event.preventDefault();
                stop = false;
            }
            $("#player_video").click();
        });

    });