Reputation: 307
I have a Vimeo URL that looks like this:
<iframe src="https://player.vimeo.com/video/57418480?byline=0&portrait=0&autoplay=1" width="620" height="350" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
What I want to do is take the video ID, which in this case is 57418480 and replace it onclick. I would have the ID set via the class attribute. For example:
<li><a href="#" class="57418481">Ethics in Investing</a></li>
Clicking the above link would replace just the number ID, so it would then look like this:
<iframe src="https://player.vimeo.com/video/57418481?byline=0&portrait=0&autoplay=1" width="620" height="350" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
Upvotes: 0
Views: 628
Reputation: 7352
$('a').click(function() {
var newID = $(this).attr('class');
var newURL = 'https://player.vimeo.com/video/' + newID + '?byline=0&portrait=0&autoplay=1';
$('iframe').attr('src',newURL);
return false;
});
Upvotes: 1
Reputation: 44740
Use data-url in your link
<li><a href="#" data-url="https://player.vimeo.com/video/57418481?byline=0&portrait=0&autoplay=1" class="57418481">Ethics in Investing</a></li>
onclick:
$('a').on('click',function(){
$('iframe').attr('src',$(this).data('url'));
});
Upvotes: 2