[jquery] Uncaught TypeError: undefined is not a function
Via onderstaande code bestuur ik mijn playlist op mijn site, al dan niet via url.
Alles werkt totdat ik via een # een filmpje aanroep (dus de pagina herlaadt),
dan krijg ik deze error
deze gaat over regel "'onStateChange': onPlayerStateChange".
Hoe komt dit en wat doe ik fout?
Groeten knipper.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
/*===youtube playlist===*/
function onPlayerStateChange(event) {
switch(event.data) {
case YT.PlayerState.ENDED:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
//video is ten einde, triger volgende clip
var ps = $("#playlist_herhaal").val();
if(ps == 'alles') {
var vidId_next = $('.playlist .active').next().attr('id');
open_youtube(vidId_next);
} else if(ps == 'dit') {
var vidId_next = $('.playlist .active').attr('id');
open_youtube(vidId_next);
}
break;
case YT.PlayerState.PLAYING:
$("#header_favicon").attr("href","main/icon/favicon/favicon_play.ico");
break;
case YT.PlayerState.PAUSED:
$("#header_favicon").attr("href","main/icon/favicon/favicon_pause.ico");
break;
case YT.PlayerState.BUFFERING:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
break;
case YT.PlayerState.CUED:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
break;
}
}
/*Bedien youtube*/
function open_youtube(vidId) {
if(vidId != 'undefined') {
window.location.hash = 'yt_' + vidId;
$('#muziekplayer').html('<iframe id="player_'+vidId+'" width="100%" height="315" src="http://www.youtube.com/embed/' + vidId + '?enablejsapi=1&autoplay=1&autohide=1&showinfo=0" frameborder="0" allowfullscreen></iframe>');
$('.playlist .muziek').removeClass('active');
$('#' + vidId).addClass('active');
new YT.Player('player_'+vidId, {
events: {
'onStateChange': onPlayerStateChange
}
});
} else {
$('#muziekplayer').html('');
}
$('.playlist .muziek').removeClass('active');
$('#' + vidId).addClass('active');
}
/*Truger via knoppen in menu*/
jQuery('.playlist .muziek').click(function() {
var vidId = $(this).attr('id');
open_youtube(vidId);
});
/*auto trigger via url #(hash)*/
var hash = window.location.hash;
var substr = hash.split('_');
if(substr[0] == '#yt') {
$('#' + substr[1]).click();
}
function onPlayerStateChange(event) {
switch(event.data) {
case YT.PlayerState.ENDED:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
//video is ten einde, triger volgende clip
var ps = $("#playlist_herhaal").val();
if(ps == 'alles') {
var vidId_next = $('.playlist .active').next().attr('id');
open_youtube(vidId_next);
} else if(ps == 'dit') {
var vidId_next = $('.playlist .active').attr('id');
open_youtube(vidId_next);
}
break;
case YT.PlayerState.PLAYING:
$("#header_favicon").attr("href","main/icon/favicon/favicon_play.ico");
break;
case YT.PlayerState.PAUSED:
$("#header_favicon").attr("href","main/icon/favicon/favicon_pause.ico");
break;
case YT.PlayerState.BUFFERING:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
break;
case YT.PlayerState.CUED:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
break;
}
}
/*Bedien youtube*/
function open_youtube(vidId) {
if(vidId != 'undefined') {
window.location.hash = 'yt_' + vidId;
$('#muziekplayer').html('<iframe id="player_'+vidId+'" width="100%" height="315" src="http://www.youtube.com/embed/' + vidId + '?enablejsapi=1&autoplay=1&autohide=1&showinfo=0" frameborder="0" allowfullscreen></iframe>');
$('.playlist .muziek').removeClass('active');
$('#' + vidId).addClass('active');
new YT.Player('player_'+vidId, {
events: {
'onStateChange': onPlayerStateChange
}
});
} else {
$('#muziekplayer').html('');
}
$('.playlist .muziek').removeClass('active');
$('#' + vidId).addClass('active');
}
/*Truger via knoppen in menu*/
jQuery('.playlist .muziek').click(function() {
var vidId = $(this).attr('id');
open_youtube(vidId);
});
/*auto trigger via url #(hash)*/
var hash = window.location.hash;
var substr = hash.split('_');
if(substr[0] == '#yt') {
$('#' + substr[1]).click();
}
Over lijn
Je moet nog een object meegeven in die functie. Alleen welk object dat is..... geen idee.
Weet iemand wat nu?
Kan je de volledige code posten?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<script>
$(document).ready(function(){
/*===youtube playlist===*/
function onPlayerStateChange(event) {
switch(event.data) {
case YT.PlayerState.ENDED:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
//video is ten einde, triger volgende clip
var ps = $("#playlist_herhaal").val();
if(ps == 'alles') {
var vidId_next = $('.playlist .active').next().attr('id');
open_youtube(vidId_next);
} else if(ps == 'dit') {
var vidId_next = $('.playlist .active').attr('id');
open_youtube(vidId_next);
}
break;
case YT.PlayerState.PLAYING:
$("#header_favicon").attr("href","main/icon/favicon/favicon_play.ico");
break;
case YT.PlayerState.PAUSED:
$("#header_favicon").attr("href","main/icon/favicon/favicon_pause.ico");
break;
case YT.PlayerState.BUFFERING:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
break;
case YT.PlayerState.CUED:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
break;
}
}
/*Bedien youtube*/
function open_youtube(vidId) {
if(vidId != 'undefined') {
window.location.hash = 'yt_' + vidId;
$('#muziekplayer').html('<iframe id="player_'+vidId+'" width="100%" height="315" src="http://www.youtube.com/embed/' + vidId + '?enablejsapi=1&autoplay=1&autohide=1&showinfo=0" frameborder="0" allowfullscreen></iframe>');
$('.playlist .muziek').removeClass('active');
$('#' + vidId).addClass('active');
new YT.Player('player_'+vidId, {
events: {
'onStateChange': onPlayerStateChange()
}
});
} else {
$('#muziekplayer').html('');
}
$('.playlist .muziek').removeClass('active');
$('#' + vidId).addClass('active');
}
/*Truger via knoppen in menu*/
jQuery('.playlist .muziek').click(function() {
var vidId = $(this).attr('id');
open_youtube(vidId);
});
/*auto trigger via url #(hash)*/
var hash = window.location.hash;
var substr = hash.split('_');
if(substr[0] == '#yt') {
$('#' + substr[1]).click();
}
});
</script>
$(document).ready(function(){
/*===youtube playlist===*/
function onPlayerStateChange(event) {
switch(event.data) {
case YT.PlayerState.ENDED:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
//video is ten einde, triger volgende clip
var ps = $("#playlist_herhaal").val();
if(ps == 'alles') {
var vidId_next = $('.playlist .active').next().attr('id');
open_youtube(vidId_next);
} else if(ps == 'dit') {
var vidId_next = $('.playlist .active').attr('id');
open_youtube(vidId_next);
}
break;
case YT.PlayerState.PLAYING:
$("#header_favicon").attr("href","main/icon/favicon/favicon_play.ico");
break;
case YT.PlayerState.PAUSED:
$("#header_favicon").attr("href","main/icon/favicon/favicon_pause.ico");
break;
case YT.PlayerState.BUFFERING:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
break;
case YT.PlayerState.CUED:
$("#header_favicon").attr("href","main/icon/favicon/favicon.ico");
break;
}
}
/*Bedien youtube*/
function open_youtube(vidId) {
if(vidId != 'undefined') {
window.location.hash = 'yt_' + vidId;
$('#muziekplayer').html('<iframe id="player_'+vidId+'" width="100%" height="315" src="http://www.youtube.com/embed/' + vidId + '?enablejsapi=1&autoplay=1&autohide=1&showinfo=0" frameborder="0" allowfullscreen></iframe>');
$('.playlist .muziek').removeClass('active');
$('#' + vidId).addClass('active');
new YT.Player('player_'+vidId, {
events: {
'onStateChange': onPlayerStateChange()
}
});
} else {
$('#muziekplayer').html('');
}
$('.playlist .muziek').removeClass('active');
$('#' + vidId).addClass('active');
}
/*Truger via knoppen in menu*/
jQuery('.playlist .muziek').click(function() {
var vidId = $(this).attr('id');
open_youtube(vidId);
});
/*auto trigger via url #(hash)*/
var hash = window.location.hash;
var substr = hash.split('_');
if(substr[0] == '#yt') {
$('#' + substr[1]).click();
}
});
</script>
Je zal function onPlayerStateChange moeten verplaatsen; zorg dat die globaal staat, dus buiten $(document).ready()
Youtube probeert de functie aan te roepen, maar die bevindt zich buiten de scope waar Youtube aan kan.
En lijn 45 is sowieso zonder ()
'onStateChange': onPlayerStateChange
Gewijzigd op 13/11/2013 14:15:23 door Kris Peeters
@Kris kan je daar een voorbeeld van geven? ik had die "()" er weer af gehaalt en de functie onder <script> gezet en dan kreeg ik weer die "undefined" error en met de haakjes weer de "data" error.
Quote:
Uncaught TypeError: undefined is not a function
Toen hij meegaf met haakjes kreeg hij
Quote:
Uncaught TypeError: Cannot read property 'data' of undefined
Met andere woorden in eerste instantie werd de functie niet gevonden, in tweede instantie wel. Het probleem in de tweede is echter dat er nog een object meegegeven moet worden wat niet gedaan wordt (vandaar de error 'Cannot read propperty data of undefined'). Vraag is alleen welk object, of watvoor object. Het lijkt op een event handler en ik zou dan zeggen een event object, maar bij mijn weten hebben die geen data property. Wat dan wel?