Issue
I am trying to make a form that goes like this:
- You enter a URL into a text box.
- You click a button and it opens an
about:blank
page in a new tab. - This page has an iframe that fills the whole screen and the src is set to the link you entered in the text box.
This is what I have tried but whatever I choose opens blank, I am using google.com as the example here.
<!DOCTYPE html>
<html>
<head>
<title>about:blank | 3kh0</title>
</head>
<body>
<script>
function create() {
var url = document.getElementById('input');
var win = window.open();
win.document.body.style.margin = '0';
win.document.body.style.height = '100vh';
var iframe = win.document.createElement('iframe');
iframe.style.border = 'none';
iframe.style.width = '100%';
iframe.style.height = '100%';
iframe.style.margin = '0';
iframe.src = url;
win.document.body.appendChild(iframe);
}
</script>
<input type="text" value="https://www.google.com/" placeholder="https://google.com" id='input' autofocus>
<button onclick='create()'>Create!</button>
</body>
</html>
If you have any ideas on how I can do this that would be amazing! :)
Solution
You should add ".value" at the end of line 9.
from
var url = document.getElementById('input');
to
var url = document.getElementById('input').value;
Answered By - EitanBiletski
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.