我已经在这几天了。我无法让这个工作。希望有人可以帮助我，并指出我正确的方向。
使用jPlayer（http://jplayer.org）
我需要将Cookie设置为以下内容，以便当用户返回该网页时，播放器会保存这些设置！
1）音量
2）播放（自动播放）
3）停止
4）歌曲（曲目）
谢谢！ 添
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title> </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="music/dist/skin/blue.monday/css/jplayer.blue.monday.min.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="music/lib/jquery.min.js"></script>
<script type="text/javascript" src="music/lib/jquery.cookie.min.js"></script>
<script type="text/javascript" src="music/dist/jplayer/jquery.jplayer.min.js"></script>
<script type="text/javascript" src="music/dist/add-on/jplayer.playlist.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
new jPlayerPlaylist({
jPlayer: "#jquery_jplayer_1",
cssSelectorAncestor: "#jp_container_1"
}, [
{
title:"Cro Magnon Man",
mp3:"http://www.jplayer.org/audio/mp3/TSP-01-Cro_magnon_man.mp3",
oga:"http://www.jplayer.org/audio/ogg/TSP-01-Cro_magnon_man.ogg"
},
{
title:"Your Face",
mp3:"http://www.jplayer.org/audio/mp3/TSP-05-Your_face.mp3",
oga:"http://www.jplayer.org/audio/ogg/TSP-05-Your_face.ogg"
},
{
title:"Cyber Sonnet",
mp3:"http://www.jplayer.org/audio/mp3/TSP-07-Cybersonnet.mp3",
oga:"http://www.jplayer.org/audio/ogg/TSP-07-Cybersonnet.ogg"
},
{
title:"Tempered Song",
mp3:"http://www.jplayer.org/audio/mp3/Miaow-01-Tempered-song.mp3",
oga:"http://www.jplayer.org/audio/ogg/Miaow-01-Tempered-song.ogg"
},
{
title:"Thin Ice",
mp3:"http://www.jplayer.org/audio/mp3/Miaow-10-Thin-ice.mp3",
oga:"http://www.jplayer.org/audio/ogg/Miaow-10-Thin-ice.ogg"
}
], {
swfPath: "music/dist/jplayer",
supplied: "oga, mp3",
wmode: "window",
useStateClassSkin: true,
autoBlur: false,
loop: true,
smoothPlayBar: true,
keyEnabled: true
});
});
//]]>
</script>
</head>
<body>
<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<div id="jp_container_1" class="jp-audio" role="application" aria-label="media player">
<div class="jp-type-playlist">
<div class="jp-gui jp-interface">
<div class="jp-controls">
<button class="jp-previous" role="button" tabindex="0">previous</button>
<button class="jp-play" role="button" tabindex="0">play</button>
<button class="jp-next" role="button" tabindex="0">next</button>
<button class="jp-stop" role="button" tabindex="0">stop</button>
</div>
<div class="jp-progress">
<div class="jp-seek-bar">
<div class="jp-play-bar"></div>
</div>
</div>
<div class="jp-volume-controls">
<button class="jp-mute" role="button" tabindex="0">mute</button>
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
<div class="jp-volume-bar">
<div class="jp-volume-bar-value"></div>
</div>
</div>
<div class="jp-time-holder">
<div class="jp-current-time" role="timer" aria-label="time"> </div>
<div class="jp-duration" role="timer" aria-label="duration"> </div>
</div>
<!-- <div class="jp-toggles">
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
<button class="jp-shuffle" role="button" tabindex="0">shuffle</button>
</div> -->
</div>
<div class="jp-playlist">
<ul>
<li> </li>
</ul>
</div>
<div class="jp-no-solution">
<span>Update Required</span>
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
</div>
</div>
</div>
</body>
</html>
答案 0 :(得分：1)
我的代码未经测试，因此如果有任何错误，您无法修复只是回复。
不要使用cookies。请改为使用Web Storage http://www.w3schools.com/html/html5_webstorage.asp
您有两种选择可以满足您的需求：
window.localStorage - 存储没有过期日期的数据
window.sessionStorage - 存储一个会话的数据（浏览器选项卡关闭时数据丢失）
我认为你想要sessionStorage。
$(document).ready(function(){
window.userSettings = null;
new jPlayerPlaylist({
jPlayer: "#jquery_jplayer_1",
cssSelectorAncestor: "#jp_container_1"
}, [
{
title:"Cro Magnon Man",
mp3:"http://www.jplayer.org/audio/mp3/TSP-01-Cro_magnon_man.mp3",
oga:"http://www.jplayer.org/audio/ogg/TSP-01-Cro_magnon_man.ogg"
},
{
title:"Your Face",
mp3:"http://www.jplayer.org/audio/mp3/TSP-05-Your_face.mp3",
oga:"http://www.jplayer.org/audio/ogg/TSP-05-Your_face.ogg"
},
{
title:"Cyber Sonnet",
mp3:"http://www.jplayer.org/audio/mp3/TSP-07-Cybersonnet.mp3",
oga:"http://www.jplayer.org/audio/ogg/TSP-07-Cybersonnet.ogg"
},
{
title:"Tempered Song",
mp3:"http://www.jplayer.org/audio/mp3/Miaow-01-Tempered-song.mp3",
oga:"http://www.jplayer.org/audio/ogg/Miaow-01-Tempered-song.ogg"
},
{
title:"Thin Ice",
mp3:"http://www.jplayer.org/audio/mp3/Miaow-10-Thin-ice.mp3",
oga:"http://www.jplayer.org/audio/ogg/Miaow-10-Thin-ice.ogg"
}
], {
swfPath: "music/dist/jplayer",
supplied: "oga, mp3",
wmode: "window",
useStateClassSkin: true,
autoBlur: false,
loop: true,
smoothPlayBar: true,
keyEnabled: true,
ready: function () {
storeUserjPlayerSettings();
//Auto play music when jPlayer is ready
if (userSettings[0].autoPlay)
{
$("#jquery_jplayer_1").jPlayer("play");
}
},
});
});
function storeUserjPlayerSettings(){
var settings = new Object();
settings.volume = $("#jquery_jplayer_1").data().jPlayer.status.volume;
settings.paused = $("#jquery_jplayer_1").data().jPlayer.status.paused;
settings.src = $("#jquery_jplayer_1").data().jPlayer.status.src; //(I presume u want src and not title...)
//Jplayer doesn't have autoplay setting, you'll need to manually set autoPlay somewhere
settings.autoPlay = autoPlay;
sessionStorage.setItem('userjPlayerSettings', JSON.stringify(settings));
window.userSettings = JSON.parse(sessionStorage.getItem('userjPlayerSettings'));
}
通过以下方式访问各个元素：
var volume = userSettings [0].volume;