jplayer点击播放没有任何反应

Posted 2023-02-25

【中文标题】jplayer点击播放没有任何反应

【英文标题】：jplayer clicking play nothing happening

【发布时间】：2011-10-31 11:14:57

【问题描述】：

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

【参考方案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"
);

【参考方案2】：

这正是它对我的工作方式。注意第一行，它分配了一个点击处理程序来阻止点击链接的默认行为......

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