javascript - jplayer单击播放没有任何反应

Question

我目前正在与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>

Answer 1

自从我使用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"
});