0

I am trying to extract the last part of a YouTube URL so that I can embed video into my desired container. After looking around on Stack I believe I am on the right track.

If anyone is able to help me that would be much appreciated. Please see my code below:

$(document).ready(function() {
    var thumbFetch = $('.js-thumb');
    var youTubeID = thumbFetch.val().substring(thumbFetch.lastIndexOf('/') + 1);
    thumbFetch.change(function() {
        if(thumbFetch.val().length > 0) {
            $('.content-img-wrapper').html('<iframe width="100%" height="100%" src="http://www.youtube.com/embed/' + youTubeID + '?rel=0&controls=0&showinfo=0" frameborder="0" allowfullscreen></iframe>');
        } else {
            $('.content-img-wrapper').empty();
            $('.content-img-wrapper').html('<div class="content-img-placeholder"></div>');
        }
     });
});

Here is a jsfiddle so that you can see what's going on: http://jsfiddle.net/rxa0d7va/

I am getting an error that says 'thumbFetch.lastIndexOf is not a function'. I don't understand this as I am following the answer of this question: Last segment of URL

If anyone is able to point me in the direction of how I have gone wrong, that would be much appreciated.

Community
  • 1
  • 1
DanMad
  • 1,643
  • 4
  • 23
  • 58

1 Answers1

1

You missed referencing the value of thumbFetch.

Have thumbFetch.val().lastIndexOf('/') + 1 instead of thumbFetch.lastIndexOf('/') + 1

Griffith
  • 3,229
  • 1
  • 17
  • 30