I have the following JavaScript code to which I want to pass parameters from a onClick
event, but they are not recognized:
HTML
<a id="addplaylist" href="javascript:void(0);" onclick="Addplayer(true,'', '', '', 'public/playlist/playlist2.xml')" class="ouvir_album btn defaut" ><i class="fa fa-plus-square-o"></i> Incluir todas no player</a>
JS
$(document).ready(function () {
var url = '<?php echo base_url();?>';
function Addplayer(album, titulo, artista, capa, urlfile) {
if (album == false) {
myPlaylist.add({
title: titulo,
artist: artista,
poster: capa,
mp3: encodeURI(urlfile)
});
myPlaylist.play()
} else {
alert(urlfile);
$.ajax({
type: "GET",
url: url + urlfile,
dataType: "xml",
success: function (xml) {
$(xml).find('track').each(function () {
var self = $(this),
titulo = self.find('title').text(),
artista = self.find('artist').text(),
urlfile = self.find('mp3').text(),
capa = self.find('poster').text(),
playlist = JSON.stringify({
title: titulo,
artist: artista,
mp3: urlfile,
poster: capa
}),
playlistObject = $.parseJSON(playlist);
myPlaylist.add(playlistObject);
});
}
});
}
}
var cssSelector = {
jPlayer: "#player_thumbs",
cssSelectorAncestor: "#jp_container_N"
};
var playlist = [
];
var options = {
swfPath: url + "public/js/Jplayer.swf",
supplied: "webmv, mp3",
keyEnabled: true,
volumechange: function (event) {
if (event.jPlayer.options.muted) {
$(".jp-volume-bar").slider("value", 0);
} else {
$(".jp-volume-bar").slider("value", event.jPlayer.options.volume);
}
},
timeupdate: function (event) {
$(".jp-progress").slider("value", event.jPlayer.status.currentPercentAbsolute);
},
playlistOptions: {
enableRemoveControls: true
},
play: function (event) {
$(".equalize span").addClass("active");
},
pause: function (event) {
$(".equalize span").removeClass("active");
}
};
var myPlaylist = new jPlayerPlaylist(cssSelector, playlist, options);
var PlayerData = $(cssSelector.jPlayer).data("jPlayer");
// Create the volume slider control
$(".jp-volume-bar").slider({
animate: "fast",
max: 1,
range: "min",
step: 0.01,
value: $.jPlayer.prototype.options.volume,
slide: function (event, ui) {
$(cssSelector.jPlayer).jPlayer("option", "muted", false);
$(cssSelector.jPlayer).jPlayer("option", "volume", ui.value);
}
});
// Create the progress slider control
$(".jp-progress").slider({
animate: "fast",
max: 100,
range: "min",
step: 0.1,
value: 0,
slide: function (event, ui) {
var sp = PlayerData.status.seekPercent;
if (sp > 0) {
// Move the play-head to the value and factor in the seek percent.
$(cssSelector.jPlayer).jPlayer("playHead", ui.value * (100 / sp));
} else {
// Create a timeout to reset this slider to zero.
setTimeout(function () {
$(".jp-progress").slider("value", 0);
}, 0);
}
}
});
$(".title_music").hover(function () {
$('.jp-title').toggleClass('marquee');
});
});
What am I doing wrong to not be able to pass the parameters to the function?