Having an issue with Jplayer changing a track when a link is clicked. It still plays the demo track from the player and doesn't play harry.mp3 or harry2.mp3

<tr><td>Tracklist:</td></tr>
<script>$('#mp31').click(function()
`{  $("#jp-player").jPlayer({   ready: function () {    $(this).jPlayer("setMedia", { mp3: "/harry.mp3",    });   },   swfPath: "/js",   supplied: "mp3"  }); });` </script>

<tr><td>1. </td><td><a href="" id="mp31">Test</a>Friend</a> (Techno)</td></tr>
<script>$('#mp32').click(function(){  $("#jp-player").jPlayer({   ready: function () {    $(this).jPlayer("setMedia", { mp3: "/harry2.mp3",    });   },   swfPath: "/js",   supplied: "mp3"  }); }); </script><tr><td>2. </td><td><a href="" id="mp32">Test</a>Enemy</a> (Ambient)</td></tr>

Can anyone please help, it's doing my head in.

CP

有帮助吗?

解决方案

You have two instances of jplayer. According to your scenario, you should have only one. Also, take care of your typos. Finally, you could try with something like this:

<tr>
    <td>Tracklist:</td>
</tr>

<tr>
    <td>1.</td>
    <td><a class="song" href="http://my-website.com/mp31.mp3" id="mp31">Test</a>Friend</a> (Techno)</td>
</tr>
<tr>
    <td>2.</td>
    <td><a class="song" href="http://my-website.com/mp32.mp3" id="mp32">Test</a>Enemy</a> (Ambient)</td>
</tr>

The code above show you a list of <a> elements with the mp3 url that you want to play, so, by this way yo can update the player once the click them:

<script>
    $("#jp-player").jPlayer({
        ready: function () {
            $(this).jPlayer("setMedia", {
                mp3: "/harry.mp3"
            });
        },
        swfPath: "/js", supplied: "mp3"
    });

    $('.song').click(function (e) {
        e.preventDefault();

        // get the song url from the href attribute
        var song = $(this).attr('href');

        $("#jp-player").jPlayer({
            ready: function () {
                $(this).jPlayer("setMedia", {
                    mp3: song
                });
            },
            swfPath: "/js", supplied: "mp3"
        });
    });

</script>
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top