I have a youtube image parser function in javascript. Which is perfectly work when a youtube url inserted in the input box.
I want the function to work automatically with the pre-put text. For example, this value (url) loaded from database. And once the page is completely loaded. This function is call up and execute the thumbnails without doing anything with the box nor click.
Javascript:
function youtube_parser(url) {
var regExp = /.*(?:youtu.be/|v/|u/w/|embed/|watch?v=)([^#&?]*).*/;
var match = url.match(regExp);
if (match && match[1].length == 11) {
urllink = match[1];
imagelink = "<img src="http://img.youtube.com/vi/"+urllink+"/hqdefault.jpg">";
} else {
//urllink = "test"
}
document.getElementById("ytimagelink").value = urllink;
document.getElementById("ytimage").ierHTML = imagelink;
}
HTML
<div><strong>Insert YouTube url:</strong></div>
<input type="text" id="ytlink" onkeyup="youtube_parser(this.value)">
<hr>
<div><strong>Output: YouTube video id:</strong></div>
<input type="text" id="ytimagelink" value="">
<div><strong>Output: Thumbnail</strong></div>
<div id="ytimage"></div>
Fiddle here : http://jsfiddle.net/PMrLR/7/
I expect the #ytlink input to execute just like when I put/insert the youtube url. So the thumbnails shows up in div#ytimage.
