Use image url in text box to display pic after submit - html

Question

Using html for my page I have a text box and a submit button. I want to be able to put an image url into the text box, click submit, and have the image display below the submit button. I DO NOT want to upload a picture as a file. I have looked around for how to do this but have not had any luck. Any ideas?
<form>
<input type="text" name="imglink" value="insert image URL here" onclick="this.select()"><br>
<input type="submit" value="Load Image">
</form>

Answer 1

Here is another example, with pure Javascript. Instead of "submit" i used "button" to not submit the form.
<form action="#" method="post">
<input type="url" name="imglink" id="imglink" placeholder="Insert image URL here" /><br>
<input type="button" value="Show Image" id="btn1" />
</form>
<div id="photo"></div>
<script>
document.getElementById('btn1').addEventListener('click', function(){
document.getElementById('photo').innerHTML = '<img src="'+ document.getElementById('imglink').value +'" alt="Image" />';
});
</script>

Answer 2

Something like this will allow you to enter a url and upload under your submit button. Ensure that you have jquery available for this to work.
https://jsfiddle.net/7L031bfj/
HTML
<form>
<input type="text" id="input">
<button type="button" id="submit">Submit</button>
</form>
<div id="photo"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
JS
$('#submit').click(function(){
var photo = $('#input').val();
$('#photo').append('<img src=' + photo + '>')
});

Answer 3

Instead of using text box, you can use this Attribute <input type="file">.

Answer 4

Is this what you want, as i am also slightly unclear as what you want
https://jsfiddle.net/q65rxcbg/
<input type="text" id='imglink' value="insert image URL here">
<br>
<input type="submit" id='submit' value="Load Image">
<br/>
<img id='photo'>
$('#submit').click(function () {
var selectedFile = $('#imglink').val();
$('#photo').attr("src", selectedFile);
});