Embed Youtube Video That User Inputs

I am trying to create a code in HTML that embeds a YouTube video (but the URL that you entered). I would enter the url (ex: www.youtube.com/watch?v=XXXXXXXXXXX), and then it would

Solution 1:

Try to continue from that fiddle:

https://jsfiddle.net/8kodfrsy/

What I've made was just to change the video src attribute.

document.getElementById('myframe').src = url;

If you reference this answer here you'll notice that the video's url needs to have /embed/<video id>

So, for example, if you have the following url:

https://www.youtube.com/watch?v=ChOTlnQZ4uU

You're going to change it to:

https://www.youtube.com/embed/ChOTlnQZ4uU

So, just transform the string to get the video id and modify the url string using simple js.

Check this on how to transform the string url.

Solution 2:

The best answer is, I believe, the following code:

<formaction="http://www.youtube.com/results"method="get"target="_blank" ><inputname="search_query"type="text"maxlength="128" /><selectname="search_type"><optionvalue="">Videos</option><optionvalue="search_users">Channels</option></select><inputtype="submit"value="Search" /></form>