jplayer нажав играть ничего не происходит - PullRequest
Новая
       24

jplayer нажав играть ничего не происходит

0 голосов
/ 31 октября 2011

В настоящее время я работаю с jPlayer, чтобы добавить несколько звуковых клипов на свой веб-сайт, однако, когда я нажимаю кнопку воспроизведения, ничего не происходит ... страница просто перезагружается, как если бы я нажал на ссылку, ниже мой HTML и мой javascript, и также измененный DOM. 

$("#jquery_jplayer").jPlayer({
            ready: function (event) {
                $('.voice').click(function(e) {
                    $(this).jPlayer("setFile", $(this).attr('rel')).jPlayer("play");
                e.preventDefault();
                });
            },
            solution: "flash, html", // Flash with an HTML5 fallback.
            swfPath: "/media/js/jPlayer/",
            wmode: "window"
        });
});



   <li><a href="" rel="<?php echo base_url(); ?>media/uploads/audio/<?php echo $candidate_audio['url']; ?>" class="voice">Play Voice Over</a></li>

Флэш-держатель 

<div id="jquery_jplayer"></div>

изменено на domReady тоже .... 

<div id="jquery_jplayer" style="width: 0px; height: 0px;">
    <img id="jp_poster_0" style="width: 0px; height: 0px; display: none;">
    <object width="1" height="1" id="jp_flash_0" data="/media/js/jPlayer/Jplayer.swf" type="application/x-shockwave-flash" style="width: 0px; height: 0px;">
    <param name="flashvars" value="jQuery=jQuery&amp;id=jquery_jplayer&amp;vol=0.8&amp;muted=false">
    <param name="allowscriptaccess" value="always">
    <param name="bgcolor" value="#000000">
    <param name="wmode" value="window">
    </object>
 </div>

Ответы [ 2 ]

0 голосов
/ 31 октября 2011

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

$(document).ready(function(){

    $('[class^="jp-"]').click(function (e) { e.preventDefault(); });

    $("#jquery_jplayer").jPlayer({
       ready: function () {
           $(this).jPlayer("setMedia", {
               mp3: "/music/mySong.mp3"
            });
       },
       swfPath: "/jPlayer/js",
       supplied: "mp3",
       volume: 0.6
    });
});

В вашем случае вы можете попробовать следующее.preventDefault() должен быть первым элементом в функции ... 

$(document).ready(function(){
    $("#jquery_jplayer").jPlayer({
        ready: function (event) {
            $('.voice').click(function(e) {
                e.preventDefault();  // <-- first item in this function
                $(this).jPlayer("setFile", $(this).attr('rel')).jPlayer("play");
            });
        },
        solution: "flash, html", // Flash with an HTML5 fallback.
        swfPath: "/media/js/jPlayer/",
        wmode: "window"
    });
});

Также обратите внимание, что в исходной публикации вы либо сделали простую опечатку в SO, либо в результате ошибки программирования.Существует дополнительный набор закрывающих скобок, }); или вы не поместили / пропустили начальную строку document.ready. 

        $("#jquery_jplayer").jPlayer({
            ready: function (event) {
                $('.voice').click(function(e) {
                    $(this).jPlayer("setFile", $(this).attr('rel')).jPlayer("play");
                e.preventDefault();
                });
            },
            solution: "flash, html", // Flash with an HTML5 fallback.
            swfPath: "/media/js/jPlayer/",
            wmode: "window"
        }); 
});  // <--- remove extra closing brackets
0 голосов
/ 31 октября 2011

Прошло много времени с тех пор, как я использовал jPlayer, но я думаю, что эта строка: $(this).jPlayer("setFile"... - это проблема. Поскольку вы делаете это в обработчике кликов, this, вероятно, будет указывать на неправильный элемент. Я бы попробовал это: 

$("#jquery_jplayer").jPlayer({
    ready: function (event) {
        var $this = $(this);
        $('.voice').click(function(e) {
            $this.jPlayer("setFile", $(this).attr('rel')).jPlayer("play");
            e.preventDefault();
        });
    },
    solution: "flash, html", // Flash with an HTML5 fallback.
    swfPath: "/media/js/jPlayer/",
    wmode: "window"
});
...