1

我在我的页面中使用 jplayer，当点击一个链接时，我想播放点击的链接。但是每次播放 test1.mp3。我该如何解决？代码如下：

如果需要，页面如下：

http://www.dilyurdu.com/audio.htm

function listen(mp3_index){ 

    var mp3_file;
    mp3_file="test"+mp3_index+".mp3";


     $("#jquery_jplayer_1").jPlayer({ 
        ready: function(event) { 
            $(this).jPlayer("setMedia", { 
                mp3: mp3_file, 
        }); 
     }, 
    swfPath: "http://www.jplayer.org/2.1.0/js", 
    supplied: "mp3" 
  });   

}

链接如下：

<div id="jquery_jplayer_1" class="jp-jplayer"></div>

<a href="javascript:listen(1);" class="jp-play" >play 1</a><br /><br />     

<a href="javascript:listen(2);" class="jp-play" >play 2</a><br /><br />

<a href="javascript:listen(3);" class="jp-play" >play 3</a>
4

4 回答 4

3

嘿，您可以执行以下操作。

我在页面加载时实例化播放器：

jQuery("#jquery_jplayer_1").jPlayer({
  swfPath: "http://www.jplayer.org/latest/js/Jplayer.swf",
  supplied: "mp3",
  wmode: "window",
  preload:"auto",
  autoPlay: true,
  errorAlerts:false,
  warningAlerts:false
});

然后在每个项目都是唯一的侦听器中，您需要： A)获取轨道名称/URL，我想您应该能够弄清楚这一点。

B)将轨道传递给 setMedia

  jQuery("#jquery_jplayer_1").jPlayer("setMedia", {
    mp3: "http:xxxx.rackcdn.com/"+track+".MP3"
  });

C)播放曲目

  jQuery("#jquery_jplayer_1").jPlayer("play");

要获取曲目 ID，您需要在可播放项目上安装侦听器（可能是可播放类？）并从该项目中获取曲目。

于 2013-03-08T15:16:33.860 回答
0

我也在为此寻找解决方案。刚刚在 jsfiddle 中创建它访问http://jsfiddle.net/vijayweb/A5LQF/2/

它只播放一首歌。任何帮助将不胜感激。

我找到了一个相关的解决方案......仍然只播放第一首默认歌曲。 带有 jplayer 的单个页面中的多个 mp3 链接

于 2012-05-13T19:49:15.183 回答
0

HTML：

<a class="ChangePath" data-key="1" href="javascript:void(0);">Song1</a>
<a class="ChangePath" data-key="2" href="javascript:void(0);">Song1</a>
<a class="ChangePath" data-key="3" href="javascript:void(0);">Song1</a>

jQuery：

$(function () {
    $('.ChangePath').on('click', function () {

    $("#jquery_jplayer_1").jPlayer("destroy");

    var link = "test" + $(this).data('key') + ".mp3";

    $("#jquery_jplayer_1").jPlayer({
        ready: function () {
            $(this).jPlayer("setMedia", {
                mp3: link
            });
        },
        swfPath: "~/Scripts/jplayer",
        supplied: "mp3"
    });

    player.jPlayer("play", 0);

});
});

如果你使用 ajax：

$(function () {
    $('.ChangePath').on('click', function () {
   $.ajax({
    $("#jquery_jplayer_1").jPlayer("destroy");

    var link = "test" + $(this).data('key') + ".mp3";

    $("#jquery_jplayer_1").jPlayer({
        ready: function () {
            $(this).jPlayer("setMedia", {
                mp3: link
            });
        },
        swfPath: "~/Scripts/jplayer",
        supplied: "mp3"
    });

    player.jPlayer("play", 0);
});
});
});

根据您的项目，您可能需要将超链接更改为其他内容，但 jQuery 可以工作。

于 2014-07-16T15:22:58.747 回答
-1 
$('.reproducirContenedor').on('click',function(e){// click en el elento a reproducir
    e.preventDefault();//para que cuando el usuario haga click en el icono de play no salte la pagina


    jQuery("#jquery_jplayer_1").jPlayer({
        swfPath: "http://www.jplayer.org/latest/js/Jplayer.swf",
        supplied: "mp3",
        wmode: "window",
        preload:"auto",
        autoPlay: true,
        errorAlerts:false,
        warningAlerts:false
      });
   
    var url_destino=$(this).attr('data-demo');// obtengo la ubicacion del archivo de audio para reproducirlo



    jQuery("#jquery_jplayer_1").jPlayer("setMedia", {
        mp3:url_destino
      });

      jQuery("#jquery_jplayer_1").jPlayer("play");
    
        
});
于 2020-06-29T07:28:27.327 回答