私はこれを持っています
<div class="sc_menu">
<a href="#" m4v="/audio/01_Tribu.m4a" oga="/audio/01_Tribu.ogg" mp3="/audio/01_Tribu.mp3"><img src="/artistes/jean-luc_gergonne/jlgergonne_thumb.jpg" alt="/artistes/jean-luc_gergonne/jlgergonne.jpg"></a>
<a href="#" m4v="/artistes/diez/diez_demo.m4a" oga="/artistes/diez/diez_demo.ogg" mp3="/artistes/diez/diez_demo.mp3"><img src="/artistes/diez/diez_130x195.jpeg" alt="/artistes/diez/diez.jpeg"></a>
</div>
次に、同じページに、次のように表示されます。
<div class="zen">
<span class="player"></span>
<span class="circle"></span>
<span class="progress"></span>
<span class="buffer"></span>
<span class="drag"></span>
<div class="button">
<span class="icon play"></span>
<span class="icon pause"></span>
</div>
</div>
私のJavaScriptの一部は次のとおりです。
this.sliderMenu = function() {
//and loads the jPlayer with the sound files for the Artist
$list.find('.sc_menu img').bind('click',function(){
var $this = $(this);
var music;
title = $this.text();
mp = $this.attr("mp3");
oga = $this.attr("oga");
m4a = $this.attr("m4a");
m4v = $this.attr("m4v");
ogv = $this.attr("ogv");
webmv = $this.attr("webmv");
poster = $this.attr("poster");
music = {
title: title,
mp: mp,
oga: oga,
}
console.log(music);
self.tsunamiPlayer(music);
//clicking on a thumb, replaces the large image
$('<img class="st_preview"/>').load(function(){
var $this = $(this);
var $currImage = $('#st_main').children('img:first');
$this.insertBefore($currImage);
// jPlayer
this.tsunamiPlayer = function(music) {
///init screen
var player = $(".zen .player");
var no_of_tracks = $(".sc_menu a").length;
player.jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
m4a: m4a,
mp3: mp,
oga: oga
});
},
swfPath: "/js/jplayer/Jplayer.swf",
supplied: "m4a, mp3, oga"
});
'a'リンクimgをクリックすると、属性をjPlayerインスタンスにロードしたいのですが、console.log(music)の場合にのみ未定義が表示されます。
これを行う正しい方法は何ですか?